字間を調整するCSSプロパティには「letter-spacing」がありますが、今回は自動カーニング（文字詰め）ができるCSSプロパティ「font-feature-settings」を紹介します。 font-featur […]

今回はCSSのプロパティ「aspect-ratio」を使用して、画像の比率を指定する方法を紹介します。 aspect-ratioとは？ aspect-ratioとはCSSのプロパティで、ボックスのアスペクト比を指定するこ […]

親要素にinnerで幅指定がついている場合などに、その子要素の一部だけ画面いっぱいに表示させるには、親要素から子要素を出してコーディングをする方法をとるなど、少し手間がかかる場合があります。 そんな場合に、CSSで一部の […]

以前、SwiperとCSSを使用し、スライダーの背景画像をズームしながらふわっと切り替えする方法を書きましたが、Swiperのスライダーライブラリでフェードエフェクトを指定している場合、透過している画像を使用した際に下の […]

前回はCSSで文章を複数の列に分ける方法を紹介しました。今回は1列の幅を指定する、column-widthプロパティを紹介します。 column-widthとは CSS のプロパティで、列の幅を設定することができます。 […]

今回はCSSで文章を複数の列に分ける方法を紹介します。 文章が一行表示で横に長いと読みづらく、ユーザービリティを損なう場合があります。 そこで、CSSのプロパティで分割することによって見やすくし、可読性を高めることができ […]

今回は、CSSをまとめて記述する際に使いやすい「where:()」を紹介します。 「where:()」とは CSSの擬似クラス関数で、複数のセレクタを1つにまとめることができます。 「where:()」以外にも、同じく複 […]

今回は、指定した要素だけをなくすことができる［display:contents］を紹介します。 ［display: contents］を知る前に、まずはボックスモデルを確認 ボックスモデルとは、「HTMLやXHTMLで定 […]