カーソルでテキストを選択した際のハイライト色を変更しているWEBサイト、たまに見ますよね？

デフォルトは青色に変更されるのですが、サイトのイメージカラーにあわせたい！！という方に、

カーソルでテキストを選択した際のハイライト色を変更するCSSをご紹介します！

使うのは「selection」セレクタ

selectionセレクタでCSSを指定すると、ユーザーが選択したテキストのハイライト色の変更ができます。

IE9以降のブラウザにはすべて対応していますが、 Firefox用では「-moz-selection」ベンダープレフィックスを指定する必要があるので注意しましょう。

/*selectionを指定*/
p::selection {
    background-color:指定したい背景色コード;
    color:指定したい文字色コード;
}

/*Firefox用の書き方*/
p::-moz-selection {
        background-color:指定したい背景色コード;
    color:指定したい文字色コード;}

Request Materials資料請求

Webマーケティングにおけるパフォーマンス改善のための資料がダウンロードできます。

• ● web広告の改善事例が知りたい方
• ● 現在お願いしている代理店との比較をしたい方
• ● サービスの全体像・料金を知りたい方

資料請求

サービス概要・運用方針などを掲載！
アカウント分析の資料サンプルや実際の事例などサービスをご検討の方はぜひご一読ください。

ご相談お問い合わせ

Web広告をご検討中の方はお気軽にご相談ください。
お客さまの目的や広告運用状況に合わせて、最適なWeb広告運用プランをご提案いたします。