CSS

今回はレスポンシブデザインのコーディングをする際の事前準備,すなわち、ビューポート設定とメディアクエリの書き方です。   なんてことはないですが、どうやるんだっけ、という人向けですので、メモ ...

タイトルの装飾を、下の向きの三角形にしたいけど、どうやるの？ という疑問にお答えします。   ということで今回は、吹き出し型のタイトルを作る方法を紹介します。 いろいろなWEBサイトで見かけ ...

今回はCSSでgrid（グリッド）を実装する方法を紹介します。 この grid は、画像やカードデザインのブロック要素をたくさん並べたりする場合に役立ちます。 flex でも実装できますが、grid ...

CSSにだいぶ慣れてきて、opacityもパッと思い浮かぶようになってきたところ。   あれ、透過させる要素は背景だけでいいのに・・・・。 文字は透過させずくっきりさせたいけど、一体どうした ...

cssでmarginを設定したけど反映されない・・・ と困っている人はいませんか？   それは「marginの相殺」によるもの、かもしれません。 頭の中が「相殺？？？」となっている人は、隣り ...

今回はアルファベットを縦書きにする方法です。 このようなテキストです。 WordPress CSSコード ※htmlのコードは省略します。 .p{ writing-mode: vertical-rl; ...

今回はflexを使用したレスポンシブデザインのよくあるパターンを紹介します。 この記事でわかること ２カラム（PC）から１カラム（スマホ）に変更する ２カラムから１カラムに変更するとき、要素の順番を逆 ...

プログラミングを勉強しているみなさん、こんにちは！ ヘッダー（header）の位置を固定したい。 サイトの下の方へスクロールしても、常に最上部にヘッダーは表示させたい。 よく使う手法ですね。 けど、 ...

要素の横並びは flex を使う人がほとんどだと思いますが、今回は「float」のエラー解決を紹介します。 floatを使ったはいいが、floatを指定した要素に、下の要素が入りこんできた！なんてこと ...

今回はFontAwesomeのサイズや色を変更する方法を紹介します。   サイズ調整 FontAwesomeはテキストと同じです。 スタイルシート【 CSS】でfont-sizeで大きさを指 ...