HTML CSS 【サンプルコードあり】トップ画像にスモーク効果つけて、ロゴやタイトル入れると ロゴやタイトルにもスモーク効果がついて見にくくなった。 それを解消するのに見つけたコードの書き方。 CSS で画像にスモーク効果をあてるのは簡単で、いろんなパターンがあります。この記事では、トップ画像にスモーク効果つけて、ロゴやタイトル入れるとロゴやタイトルにもスモーク効果がついて見にくくなった。それを解消するコードの書き方1つ見つけたの... 2022.07.16 HTML CSS
VScode VScodeでコーディングする時、HTMLの最初に DOCTYPEやに記入する内容 ショートカットキーで出なくなった、一瞬で入力されない VScodeでコーディングする時、HTMLの最初にDOCTYPEや<head></head>に記入する内容、ショートカットキー「Shift+1⇒Tab」使って自動で出る設定にしてたのに、(こんな内容が自動で記入されてた。)急にこんなエラーに... 2022.07.14 VScode
HTML CSS 初心者必見。VScode使ってコーディング中にやってしまった失敗。よくやる失敗例も紹介。 VSCodeでコーディング中に、設定が反映されてないようなおかしい現象なったことありませんか?私は、しょっちゅうです。今回も、やっちゃいました。コードを書いて、修正作業してる時に関係のない文字を打ち込んでいたみたいです。それが原因で、その直... 2022.07.09 HTML CSS
HTML CSS カードレイアウト BOX型デザインでカード全体をクリック出来るようにする方法。【サンプルコードあり】 初心者がよくやる失敗しないように BOX型(カード)デザインのコーディングで初心者がよくやる失敗の1つで、aタグを入れてるが、BOX(カード)内でリンク先に飛ばない部分が出来る場合がある。BOX(カード)型デザインで、ボックス内全体をクリック可能範囲にしよと思ったが、思うよ... 2022.07.08 HTML CSS
HTML CSS CSSで文字の下線の長さや位置を自由に変更可能出来る方法わかったんでやってみました。上の線もOK 【サンプルコードあり】 HTML&CSSで文字の下に線を入れ長さの変更も可能になります。通常border-bottomで指定すれば線を入れることができます。ただ線の太さや色の指定はできるが、長さの指定はこの方法では出来ません。変更方法のサンプルコードも書いてます。 2022.07.06 HTML CSS
HTML CSS 【サンプルコードあり】HTML/CSS で画像の境目で文字の色を変更して表示する方法。数パターン参考に書いてみました。流れる文字もあり HTML/CSS 文字を画像などの境目で左右違う色に変更する方法。何パターンか記事にしてみました。今回は画像の位置がずれると、色の変更部分もズレていく感じで出来ました。この辺は、サンプルコードも書いときますので、色々数値変更してやってみてく... 2022.07.01 HTML CSS
HTML CSS HTML/CSSで作るカード型レイアウトの一例で、カーソルホバーしたらタイトルテキストが現れる設定。【サンプルコードあり】 HTML/CSSで作るカード型レイアウトの一例を参考までに記事にしました。今回は、縦型のカードでカードをホバーすると詳細のテキストとリンクボタンが表示される設定です。実際に作成したカードデザインカードの周りには、box-shadow:の設定... 2022.06.26 HTML CSS
DELL INSPIRON zino HD SSD交換 DELL INSPIRON zino HD パソコンのHDDからSSDに交換してみた。今回はHDD/SSD用変換ブラケット使用。 DELL INSPIRON zino HD パソコン今回SSDがお得に手に入ったので、このパソコンをSSD化しようと情報収集しようとしたが、情報があんまりなかった。今回何とか成功したんで、その方法記事にしてみました。YouTubeにもアップ... 2022.06.21 DELL INSPIRON zino HD SSD交換
HTML CSS 3DBOX 回転する3Dボックス作ってみました。HTMLとCSSだけで、3Dアニメーション transform-style: preserve-3d;【サンプルコードあり】 YouTube動画で3Dアニメーションで簡単そうなのあったんで。見ながら作ってみました。今回はtransform-style: preserve-3d; rotateY() translateZ();を使ってる。実際にコード書いてみました。 2022.06.20 HTML CSS
HTML CSS white-space : pre;これを指定すると。長い文章の場合でも折り返さずに表示できる。CSS CSS で white-space: pre;を指定すると。長い文章の場合でも折り返さずに表示できる。通常何も指定してない場合は。要素の端で自動で折り返される。white-spaceは、要素内での文字列を制御するとこが出来るプロパティ。 2022.06.14 HTML CSS