CSS 属性セレクターを使用して、特定のプレフィックスで始まるリンクのスタイルを設定するにはどうすればよいですか?

CSS 属性セレクターについて: a[href^="..."]

CSS では、属性セレクターを使用してスタイルを設定できます属性の値に基づいて要素を決定します。特定の属性セレクターの 1 つは、[href^="..."] です。そのコンポーネントを分解してみましょう。

• a: これは、 を持つすべての要素を選択します。
• href: これは、アンカー タグによって作成されたリンクの宛先 URL を含む href 属性を指定します。
• ^=: これは属性値演算子です。 ."
• "http:": これは、href 属性が開始する値です。 with.

仕組みは?

a[href^="http:"] セレクターは、href 属性値が で始まるすべてのアンカー タグに一致します。 「http:」。これには、通常、インターネット上の Web サイトを参照するほとんどの外部リンクが含まれます。

たとえば、次の CSS を考えてみましょう:

a[href^="http:"] {
   background: url(img/keys.gif) no-repeat right top;
}

この CSS ルールは、特定の背景画像と位置をすべてのリンクに適用します。 「http:」で始まります。

詳細使用法:

指定した例に示すように、同じ属性で複数の属性セレクターを使用することもできます。

a[href^="http://mysite.com"], a[href^="http://www.mysite.com"] {
   background-image: none; padding-right:0;
}

このルールは、「http:」で始まるすべてのリンクを対象とします。 //mysite.com」または「http://www.mysite.com」を削除し、背景画像を削除してパディングをゼロに設定します。これにより、他の外部リンクには影響を与えずに、自分の Web サイト内の外部リンクの外観をカスタマイズできます。

以上がCSS 属性セレクターを使用して、特定のプレフィックスで始まるリンクのスタイルを設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。