ドキュメント : Pseudo Element

CSSの擬似要素の１つ、beforeについてご紹介します。before擬似要素beforeは最初の子要素です。基本構文::before { プロパティ名: プロパティ値;}サンプル次のコードは擬似要素beforeでp要素の最初に子要素を定義します。<style>p::before { content: "CSSの正式名称";}</style><p>C

CSSの擬似要素の１つ、afterについてご紹介します。after擬似要素afterは最後の子要素です。基本構文::after { content: 値; プロパティ名: プロパティ値;}contentプロパティを合わせて使用します。値に文字や画像などを指定し、コンテンツを追加することができます。サンプル次のコードは擬似要素beforeでp要素の最後に子要素を定義します。<sty

CSSの擬似要素の１つ、first-letterについてご紹介します。first-letter擬似要素first-letterは最初の１文字です基本構文::first-letter { プロパティ名: プロパティ値;}サンプル次のコードは擬似要素first-letterでp要素の最初の１文字を大きくします。<style>p::first-letter { font-size

CSSの擬似要素の１つ、first-lineについてご紹介します。first-line擬似要素first-lineは１行目です基本構文::first-line { プロパティ名: プロパティ値;}サンプル次のコードは擬似要素first-lineでp要素の１行目を目立たせます。<style>p::first-line { color: red; font-size: 3

CSSの擬似要素の１つ、markerについてご紹介します。marker擬似要素markerはリストの箇条記号です。基本構文::marker { プロパティ名: プロパティ値;}サンプル次のコードは擬似要素first-letterでp要素の最初の１文字を目立たせます。<style>li::marker { content: ">";}</style><

CSSの擬似要素の１つ、placeholderについてご紹介します。placeholder擬似要素placeholderはプレイスホルダーの文字列です。通常、input要素やtextarea要素のプレイスホルダーのセレクターに使用します。基本構文::placeholder { プロパティ名: プロパティ値;}サンプル次のコードは擬似要素first-letterでp要素の最初の１文字を目立たせ

CSSの擬似要素の１つ、selectionについてご紹介します。selection擬似要素selectionは選択したテキストです。基本構文::selection { プロパティ名: プロパティ値;}サンプル次のコードは擬似要素first-letterでp要素の最初の１文字を目立たせます。<style>p::selection { color: red; backgr