【CSS】::before（擬似要素） - 最初の子要素

CSSの擬似要素の１つ、beforeについてご紹介します。

before

擬似要素beforeは最初の子要素です。

基本構文

::before {
    content: 値;
    プロパティ名: プロパティ値;
}

contentプロパティを合わせて使用します。
値に文字や画像などを指定し、コンテンツを追加することができます。

サンプル

次のコードは擬似要素beforeでp要素の最初に子要素を定義します。

<style>
p::before {
    content: "CSS : ";
    font-weight: bold;
}
</style>

<p>Cascading Style Sheets</p>