CSS - Pseudo-classe: lang

La description

La pseudo-classe : lang est utilisée pour spécifier une langue à utiliser dans un élément spécifié.

Cette classe est utile dans les documents qui doivent faire appel à plusieurs langues ayant des conventions différentes pour certaines constructions de langage. Par exemple, la langue française utilise généralement des crochets (<et>) pour les guillemets, tandis que la langue anglaise utilise des guillemets ('et').

Lors de la définition de pseudo-classes dans un bloc <style> ... </style>, les points suivants doivent être pris en compte -

  • Les noms de pseudo-classes ne sont pas sensibles à la casse.

  • Les pseudo-classes sont différentes des classes CSS mais elles peuvent être combinées.

Exemple

Dans un document qui doit aborder cette différence, vous pouvez utiliser la pseudo-classe: lang pour modifier les guillemets de manière appropriée. Le code suivant modifie la balise <blockquote> en fonction de la langue utilisée -

<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>

Les sélecteurs: lang s'appliqueront à tous les éléments du document. Cependant, tous les éléments n'utilisent pas la propriété quotes, donc l'effet sera transparent pour la plupart des éléments.