文字を選択した際の背景色などの指定
CSS3をサポートしているブラウザ以外は無視されますが、ctrl+Aなどで文字を選択した際の背景色などの指定方法についてメモ。
上がCSS3をサポートしているブラウザを対象とした疑似クラスで、下がMozillaの拡張です。
::selection {
background: #ff0011;
color: "fff ;
}
/* Firefox */
::-moz-selection {
background: #ff0011;
color: "fff ;
}
::selectionで指定できる要素は、color, background, cursor ,outlineです。
background-imageは使用しても無視されるようです。
また、特定の箇所で色選択をしたい場合は、
div.foo::selection {
background: #ff0011;
}
などで指定します。
■参考URL
Selectors[W3C]
Overriding The Default Text Selection Color With CSS[CSS-TRICS]