Déchiffrer le symbolisme abrégé des polices : la signification de la barre oblique
Dans le domaine du CSS, l'énigmatique notation abrégée des polices soulève souvent des questions . L’une de ces énigmes concerne le rôle de la barre oblique (/). Cet article approfondira la sémantique derrière ce séparateur énigmatique.
Comprendre la fonction de la barre oblique
Considérez la déclaration CSS suivante :
font: 12px/18px ...
Au sein de cette ligne, la partie 12px/18px a une signification importante. Il élucide les deux aspects suivants de la typographie :
Lier la théorie à la syntaxe
La curieuse syntaxe du raccourci de police rend hommage aux conventions typographiques. Dans la conception imprimée, la taille des caractères est exprimée en points, tandis que la hauteur de la ligne est généralement indiquée comme un multiple de la taille des caractères. Par exemple, une hauteur de ligne de 18 px implique que le texte sera rendu en utilisant une taille de police de 12 px et un espacement vertical supplémentaire de 50 % (18px = 12px, 50 % de 12px).
Traduire le raccourci en propriétés individuelles
En pratique, la déclaration abrégée de la police se traduit de manière transparente par une déclaration plus longue et plus détaillée. équivalent :
font-size: 12px; line-height: 18px;
Cela démontre que la notation abrégée offre simplement une méthode compacte pour définir plusieurs propriétés de police simultanément.
Hauteurs de ligne relatives
Il est important de noter que la hauteur de ligne peut également être exprimée sous forme de valeur relative, telle qu'un pourcentage ou une unité em. Dans de tels scénarios, le calcul est effectué par rapport à la taille de la police. Par exemple, une hauteur de ligne de 150 % signifie que l'espacement vertical entre les lignes sera 1,5 fois la taille de la police (18px = 12px * 150%).
Référence aux normes
Pour plus d'informations sur les spécifications régissant la propriété font en CSS, reportez-vous au suivant :
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!