テキスト選択色を変更する
この記事は約 3 分で読めます。
CSS の ::selection
疑似要素は、
ユーザーが (テキストをマウスでクリックやドラッグすることで)
選択した文書の一部にスタイルを適用します。
CSS Syntax
バージョン 61 以前の Firefoxには
「-moz」のベンダープレフィックスを
つけたものが必要となります。
/* 従来の Firefox の構文 (バージョン 61 以前) */
::-moz-selection
::selection
Example
/* 選択されたテキストを赤の背景に金色とする */
::selection {
color: gold;
background: red;
}
/* 選択されたテキストを青の背景に白とする */
p::selection {
color: white;
background: blue;
}
結果は、こちらから
Browser Support
Specifications
メモ:
::selection – CSS: カスケーディングスタイルシート | MDN – Mozilla::selection
は CSS Selectors Level 3 の草稿にはありましたが、 (特に要素がネストされた場合の) 振る舞いの仕様化が途中であることや相互運用性が確保されなかったこと (W3C Style mailing list での議論に基づく) から、勧告の過程で削除されました。これは Pseudo-Elements Level 4 で再導入されています。
勧告の過程で削除されたけど、
再導入されたという事らしいです。
ところで、
「W3C」とか「勧告」ってなに?
W3C(ダブリュースリーシー)とは
「World Wide Web Consortium」の略称で、
Web技術の国際的な標準規格化を推進する標準化団体の名称
だそうです。
わたしのリスペクトする
WEMO.tech さんが詳しく解説しています。
貴重なお時間を割き、W3C勧告とは?
W3C勧告とはなんぞ?Web標準化とW3Cにおける勧告プロセス …
W3Cが作成する技術文書にはその成熟までにいくつかの段階があり、技術に関するテストやレビュー、仕様変更を重ね、長い時間をかけて文書の内容を改良していきます。
そうした長いプロセスの最終段階のことを、W3Cでは「勧告」と呼んでおり、「W3C勧告された」というのはつまり、その技術に関するテストが全て終わり、「国際的に十分な信頼性があると認められた技術文書が完成した」ということです。
そして、「国際的に十分な信頼性がある技術文書が存在する」ということはつまり、その技術が「国際的に標準化された技術」と認められたということになるのです。
最後まで
ご高覧いただきまして
有難うございました
ディスカッション
コメント一覧
まだ、コメントがありません