ホームページ > 記事 > ウェブフロントエンド > CSSで特定の属性セレクターlangを使用するにはどうすればよいですか?使い方の紹介（詳しい説明）
CSSで特定の属性セレクターlangを使用するにはどうすればよいですか?使い方の紹介（詳しい説明）
- 青灯夜游オリジナル
- 2018-09-17 16:40:153090ブラウズ
CSS 2 では、属性と属性値に基づいて要素を選択できる属性セレクターが導入されました。この章では、CSS固有の属性セレクターlangの使い方（詳細説明）を紹介します。困っている友人は参考にしていただければ幸いです。
css :lang セレクター定義の使用法入門
lang 指定された lang 属性で始まる要素にスタイルを追加します。
注: 値は、lang="en" のように単語全体、または lang="en-us" のようにハイフン (-) を付けたものです。
構文:
:lang {
style:属性；
}lang 使用例:
各要素の lang 属性値は、「abstract」と同じです。 " 背景色設定 赤の場合。
p:lang(abstract){
background:red;
}次の例をもう一度見てください:
*[lang|="en"] {color: red;}上記のルールは、lang 属性が en に等しいか en- で始まるすべての要素を選択します。したがって、次のマークアップ例の最初の 3 つの要素は選択されますが、最後の 2 つの要素は選択されません:
<p lang="en">段落en</p> <p lang="en-us">段落en-us</p> <p lang="en-au">段落en-au</p> <p lang="fr">段落fr</p> <p lang="cy-en">段落xy-en</p>
langFull example
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
:lang(en) {
color:blue;
display: block;
text-decoration: none;
}
</style>
</head>
<body>
<a href="#"> phpstudy </a>
<a>HTML</a>
<a href="#"> 511遇见</a>
</body>
</html> レンダリング:
以上がCSSで特定の属性セレクターlangを使用するにはどうすればよいですか?使い方の紹介（詳しい説明）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。