CSS - Pseudo-clase: lang

Descripción

La pseudoclase: lang se usa para especificar un idioma a usar en un elemento específico.

Esta clase es útil en documentos que deben apelar a varios lenguajes que tienen diferentes convenciones para ciertas construcciones de lenguaje. Por ejemplo, el idioma francés generalmente usa corchetes angulares (<y>) para citar, mientras que el idioma inglés usa comillas ('y').

Al definir pseudoclases en un bloque <style> ... </style>, se deben tener cuidado con los siguientes puntos:

  • Los nombres de pseudoclase no distinguen entre mayúsculas y minúsculas.

  • Las pseudoclases son diferentes de las clases CSS, pero se pueden combinar.

Ejemplo

En un documento que necesita abordar esta diferencia, puede usar la pseudoclase: lang para cambiar las comillas de manera apropiada. El siguiente código cambia la etiqueta <blockquote> de forma apropiada para el idioma que se está utilizando:

<html>
   <head>
      <style type = "text/css">
         /* Two levels of quotes for two languages*/
         :lang(en) { quotes: '"' '"'  "'"  "'"; }
         :lang(fr) { quotes: "<<" ">>" "<" ">"; }
      </style>
   </head>

   <body>
      <p>...<q lang = "fr">A quote in a paragraph</q>...</p>
   </body>
</html>

Los selectores: lang se aplicarán a todos los elementos del documento. Sin embargo, no todos los elementos hacen uso de la propiedad quotes, por lo que el efecto será transparente para la mayoría de los elementos.