Tailles de police H1-H6 en HTML

Question

Dans le HTML (et de la typographie en général, je suppose), il semble que certains de tailles définies pour H1-H6 -éléments.

C'est à dire., si la ligne de base taille de la police est 16px (ou 100%), alors h1 (w/c)ould 2.25 em (36px). Et H2 (w/c)ould 1.5 em (24px). Et cetera. D'où viennent ces variables proviennent de? Le H1=36px, H2=24px, H3=21px, H4=18px, H5=16px, H6=14px, qui est. (ou, si vous le souhaitez, H1=2em, H2=1.5 em, H3=1.17 em, etc., le point n'est pas les chiffres eux-mêmes, mais la relation entre eux)

Est-il une formule mathématique pour eux? A-t-elle quelque chose à voir avec le nombre d'or ou de fibonacci? Je n'ai pas été en mesure de trouver des informations sur cette.

EDIT: pour être plus précis, qu'est-ce que le motif; pourquoi faut-il aller de 36 à 24 à 21, ou à partir de 36 pour commencer (ou, si vous le souhaitez, à partir de 2em à 1.5 em 1.17 em, etc.)?

Oh, j'ai oublié de préciser d'où je suis venu avec les numéros d'origine, ils sont d' ici

Answer 1

Ils sont définis par chaque navigateur maker de façon indépendante.

Ils ne sont pas uniformes entre les navigateurs et sont là pour la sémantique (Grande-tête, légèrement plus petite en-tête, etc...).

Si vous regardez la spécification HTML 4 pour la ces, il n'y aucune mention de la façon dont ils sont censés être de style, seulement qu'ils devraient être. À partir de la spécification:

Visual browsers usually render more important headings in larger fonts than less important ones.

Si vous souhaitez que ces pour être cohérent, vous devez utiliser un reset de la feuille de style qui les définit.

Même si w3 a défini un proposé par défaut de la feuille de style pour HTML 4 avec les détails suivants, la plupart des navigateurs ignorent cette suggestion:

h1 { font-size: 2em; margin: .67em 0 }
h2 { font-size: 1.5 em; margin: .75em 0 }
h3 { font-size: 1.17 em; margin: .83em 0 }
h5 { font-size: .83em; margin: 1.5 em 0 }
h6 { font-size: .75em; margin: 1.67 em 0 }
h1, h2, h3, h4,
h5, h6 { font-weight: bolder }

(oui, je ne vois pas d' font-size: pour h4)

Answer 2

Il est dépendante du navigateur, comme d'autres le disent.

De l'autre côté, il y a une règle de typographie pour définir des tailles de police: si la police de base a une taille X, la plus grande des polices devrait croître de façon exponentielle; la manière habituelle est d'avoir des tailles en X*sqrt(2), X*sqrt(2)^2, X*sqrt(2)^3 et ainsi de suite, mais vous pouvez modifier la base.

Cependant, les polices d'ordinateur ont des besoins particuliers.

Ils doivent être fournis dans un bitmap formulaire uniquement (donc la taille fixe), et même lorsqu'ils sont fournis en format vectoriel-certains formats préférés certaines tailles spéciales: divisible par 2 ou par 5 (c'était f.e. le cas avec les Amiga vieux polices vectorielles... Agfa Intellifont?).

Même maintenant, la police moteurs comme entier tailles plus, parce que leur affinage des algorithmes de mieux travailler.

Et les gens semblent habitués à la valeur choisie en raison de ces restrictions techniques, même si la police moteurs a obtenu beaucoup mieux maintenant.

Answer 3

Quelques chiffres nominaux:

Feuille de style par défaut pour HTML 4:

• h1: 2em
• h2: 1.5 em
• h3: 1.17 em
• h4: cadratin (1 em
• h5: 0.83 em
• h6: 0.75 em

Firefox 3 et Safari 4 (en fait, WebCore):

• h1: 2em
• h2: 1.5 em
• h3: 1.17 em
• h4: cadratin (1 em
• h5: 0.83 em
• h6: 0.67 em

Answer 4

De manière plus générale, les tailles associées de ce type sont souvent basées sur une série géométrique, c'est-à-dire que chaque nombre successif est plus grand d'un facteur constant (quelque chose comme 1,2 ou sqrt (2)) par rapport au précédent. Il existe le même type de progression dans la taille des clés et des clés hexagonales, ou des diamètres de vis, etc. en mécanique, ou dans la famille des formats de papier A5 / A4 / A3….

Answer 5

Je pense que c'est le navigateur, qui peut même permettre à l'utilisateur de définir la taille de la police (je me souviens de l'opéra de faire cela). La spécification HTML n'est pas rentré dans les détails:

Il existe six niveaux de titres en HTML avec des H1 comme le plus important et H6 comme l'est le moins. Les navigateurs visuels généralement de rendre plus important rubriques en caractères plus gros que ceux qui sont moins importants.

C'est intentionnel, car le HTML est conçu pour décrire la structure, pas la présentation du document.