[CSS] ::beforeと::afterのサンプル
CSSの疑似要素の::beforeと::afterのサンプルです。 ::before ::beforeとは / ::beforeのサンプル 画像を配置する(content:url) / 背景画像を指定する( […]
カテゴリー：HTML / CSS
CSS 階層構造でセレクタを指定(子孫/兄弟)
CSSの階層構造でセレクタを指定するサンプルです。 目次 子と孫を指定する(空白区切り) 子を指定する(>) 兄弟で弟を指定する(+) 兄弟で弟を指定する(離れていても可能 […]
CSS 継承のサンプル(inherit)
目次 01. CSSの継承 ・CSSの継承とは ・cssのcolorで継承させる例 02. inheritで継承させる例 ・marginはデフォルトでは継承されない ・inheritでmarginを強制的に継承させる例 […]
CSS セレクタの優先順位(!important)
目次 01. セレクタの優先順位 ・CSSのセレクタの優先順位とは 02. 使用例 ・同じセレクタの場合は後勝ちになる ・IDセレクタとインラインスタイルがある場合 ・!importantがある場合 ・IDセレクタ、クラ […]
CSS radial-gradient 円のグラデーションのサンプル
説明 radial-gradient サンプル circle(円)を使用(2色) circle(円)を使用(3色) ellipse(楕円)を使用 closest-corner(円の中心から最も近い角) farthest- […]
CSS linear-gradient 線のグラデーションのサンプル
説明 linear-gradient サンプル 上から下にグラデーションする(2色) 上から下にグラデーションする(3色) 上から下にグラデーション+色の位置を追加 上から下にグラデーションなしで並べる 真 […]
CSS opacity 透明度を指定する
説明 opacityとは サンプル opacityの1 opacityの0.8 opacityの0.6 opacityの0.4 opacityの0.2 opacityの0 opacityとは opacityは、透明度を指 […]
CSS text-shadow 文字に影をつける
目次 サンプル text-shadow 影のぼかし2pxを追加 影を右に10px,下に10pxにする 影の色を指定する Chromeでtext-shadowを調整する text-shadow text-shadowは、文 […]