Maison  >  Article  >  interface Web  >  Que signifie la barre oblique dans le raccourci des polices CSS ?

Que signifie la barre oblique dans le raccourci des polices CSS ?

Barbara Streisand
Barbara Streisandoriginal
2024-11-12 01:39:02284parcourir

What Does the Slash Mean in CSS Font Shorthand?

Comprendre la barre oblique dans le raccourci de police CSS

En CSS, la propriété font fournit un moyen pratique de définir plusieurs propriétés liées aux polices dans une seule déclaration. Cependant, l'utilisation d'une barre oblique dans cette propriété peut prêter à confusion.

Que signifie la barre oblique ?

La barre oblique dans la propriété CSS suivante :

font: 100%/120%;

définit en fait deux propriétés distinctes, équivalentes à :

font-size: 100%;
line-height: 120%;

Selon la documentation CSS officielle, cette syntaxe imite le raccourci typographique traditionnel pour spécifiant les tailles de caractères comme "x pt sur y pt", où "x" représente la taille du glyphe et "y" la hauteur de la ligne.

Tradition de composition

Dans le monde de la composition imprimée, il était Il est courant de spécifier des polices de caractères en utilisant cette notation "x sur y", et CSS hérite de ce concept. Le caractère barre oblique divise les valeurs de taille de police et de hauteur de ligne, tout comme dans la version imprimée.

Exigences de syntaxe

Cependant, il est important de noter que cette notation abrégée nécessite de spécifier à la fois la police famille et taille. L'exemple fourni dans votre question, font: 100%/120%;, n'est pas valide et sera ignoré par les navigateurs. Pour le rendre valide, vous devez ajouter une famille de polices, telle que :

font: 100%/120% serif;

En comprenant la signification de la barre oblique dans la propriété de police CSS, vous pouvez contrôler efficacement la taille et l'espacement des lignes de votre texte dans conception de sites Web.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn