Vai trò bộ chọn :lang trong CSS

Bộ chọn :lang()

:lang(language-code) chọn phần tử có thuộc tính lang khớp với mã ngôn ngữ chỉ định. Hữu ích cho đa ngôn ngữ, kiểu dấu ngoặc đơn, font chữ theo ngôn ngữ.

Ví dụ minh họa

<!DOCTYPE html>
<html>
<head>
  <style>
    p:lang(fr) {
      background: green; /* Sửa từ 'greeb' (lỗi chính tả) */
      color: white;
    }
  </style>
</head>
<body>
  <p>This is my country</p>
  <p lang="fr">C'est mon pays</p> <!-- Khớp :lang(fr) -->
  <p>French is the language of France</p>
</body>
</html>

Chỉ đoạn văn có lang="fr" được tạo kiểu (nền xanh, chữ trắng). Mã ngôn ngữ theo chuẩn BCP 47 (ví dụ: en, vi, zh-CN, fr-CA).