[CSS] 疑似セレクタ「:lang」で特定の言語コードを指定した要素にスタイルを適用しよう!

疑似セレクタ(:lang)の評価

頻出度

(1.0)

重要度

(1.0)

総合評価

(1.0)

疑似セレクタ「:lang」は「要素名:lang(言語) { ~ }」のカッコ内で指定したlang属性を持つ要素にスタイルを適用します。

言語コードには、ja（日本語）、en（英語）、fr（フランス語）、zh（中国語）などがあります。

それでは疑似セレクタ「:lang」の使い方をみていきましょう。

・・・

<p lang="en">Hello World!!</p>

・・・

p:lang(en) {
　color: red;
}

言語コードが英語(en)に指定されたp要素にスタイルを適用します。

疑似セレクタはなかなかイメージしづらいので実際に使ってみてどのようにスタイルが適用されるか確認するといいかと思います。