CSS辞典– category –

CSSで絶対配置の要素、position: absolute; を親要素に対して、中央に配置する方法です。 対象の要素のサイズが固定されていない時は、transform を使う方法が手軽で便利です。transform で要素の中心点をずらして中央にするイメージです。 下記の様にする...

tableのセル（ td ）の幅を均等に揃えるには、CSSで以下のように指定すると簡単に設定ができます。 [crayon-685e45442e46e566385738/] table-layout: fixed を使うと、中のコンテンツの幅に関係なく強制的に均等になります。画像やテキストが大きい場合、...

スマホなどのモバイル端末ではどうしても幅が小さく、画面に収めようとすると、表のバランスが崩れてしまいます。 比較表などでよく見かける、テーブルをスクロールできるようにするためのコードを紹介します。 HTML テーブルタグをdivなどのボックスで囲...

Webデザインにおいて、画像の色調を変更することで、シンプルで洗練されたデザインを実現できます。特に、画像をモノクロ（グレースケール）にすることで、背景を引き立たせたり、ユーザーの注目を特定の部分に誘導したりできます。本記事では、CSSを使っ...

CSSで、要素の3つごと目だけ、スタイルを適用したいことがあります。 その場合は下記のようなCSSを加えます。 下記コードは、同じ親要素の子要素で、指定したクラスに一致するものの3つごとを選択します。 [crayon-685e45442e9c4157094655/] 単純にクラス...

CSS [crayon-685e45442eb63173286889/] HTML [crayon-685e45442eb67835515392/] リセットする（横書きに戻す）場合 リセットする場合 [crayon-685e45442eb6a136902145/] 横書きにする場合 [crayon-685e45442eb6c820077965/]

改行を禁止する このプロパティを適用することで、テキストはコンテナの幅を超えても改行されず、一行に収まります。テキストを一行に保持したい時に便利ですが、テキストが長い場合、親要素をはみ出しますので注意も必要です。 [crayon-685e45442ed503570...

ウェブサイトで使用する画像を視覚的に印象づける手法のひとつに、「画像を白黒（モノクロ）」にする方法があります。 特に、マウスを乗せたときだけカラー表示にしたいといった演出では、ユーザーの注意を引きやすくなります。CSSの「filter」プロパティ...

「font-style」プロパティは、テキストのスタイルを指定するプロパティです。 テキストに対して、italic（斜体）などの装飾を加えるプロパティです。 font-style の使用例 フォントを通常のスタイルにする [crayon-685e45442f08c120114835/] フォントを斜...

font-size プロパティは、テキストの文字サイズを指定するために使用されます。 font-size の使用例 絶対的な数値を指定する [crayon-685e45442f227589649966/] 絶対的な数値を複数の要素に指定する [crayon-685e45442f229063249948/] 相対的な値を指定す...