ホームページ >ウェブフロントエンド >CSSチュートリアル >CSSを使用して選択したテキストの色を変更するにはどうすればよいですか?

CSSを使用して選択したテキストの色を変更するにはどうすればよいですか?

WBOY
WBOY転載
2023-08-26 14:33:023081ブラウズ

如何使用 CSS 更改选定文本的颜色?

Web サイト上のテキストのスタイル設定は、Web デザインと開発の重要な側面です。この目的のために、CSS (Cascading Style Sheets) は自由に使える強力なツールです。 CSS は、テキストの外観をさまざまな方法で操作できる多機能ツールです。最も人気のあるテクニックの 1 つは、選択したテキストの色を変更することです。この記事では、CSS を使用して選択したテキストの色を変更する 2 つのテクニックを学びます。

::擬似要素の選択

::selection 擬似要素は、ユーザーが現在ハイライトしているテキストを選択してスタイルを設定できる強力な機能です。選択したテキストの色を変更するには、 color プロパティを使用します。たとえば、選択したテキストをあずき色で表示したい場合は、次の CSS -

を使用します。 リーリー

これにより、Web ページ全体の選択したテキストの色が赤に変更されます。

###例###

次の例では、選択したテキストの色を赤に、背景色を黒に変更します。

リーリー

特定の要素またはクラスを使用する

特定の要素またはクラスで選択したテキストの色と背景色を変更できます。たとえば、次の CSS -

を使用して、特定の「h1」タグ内で選択したテキストの色を変更できます。 リーリー

これにより、h1 要素内で選択されたテキストの色が白に変更され、選択されたテキストの背景色が赤に変更されます。

###例###

次の例では、選択した

テキストの色を白、背景色を赤に、

テキストを赤、背景色を黄色に、

テキストを青、背景色をピンクに変更します。

リーリー ###結論は###

CSS を使用して選択したテキストの色を変更するのは簡単なタスクであり、::selection 疑似要素を利用することで実現できます。 color プロパティとbackground-color プロパティを使用すると、Web サイト上で選択したテキストの外観を変更できます。さらに、特定の要素またはクラスで ::selection 擬似要素を使用すると、選択したテキストのスタイルをより正確に制御できます。

以上がCSSを使用して選択したテキストの色を変更するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はtutorialspoint.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。