【CSS】::selection（擬似要素） - 選択範囲

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

selection

擬似要素selectionは選択したテキストです。
通常、マウスカーソルやタップでテキストを範囲選択した際にスタイルが適用されます。

基本構文

::selection {
    プロパティ名: プロパティ値;
}

サンプル

次のコードは擬似要素selectionでp要素のテキスト選択時にレイアウトを適用します。

<style>
p::selection {
    color: red;
    background: yellow;
}
</style>
<p>CSSの正式名称はCascading Style Sheetsです。セレクターやプロパティを定義し、ブラウザ表示のレイアウトや見た目を定義します。</p>