¿Cuáles son los tamaños de fuente más comunes para las etiquetas H1-H6

Question

Siempre he estado seguro de por dónde empezar como una línea de base en general mejor práctica. Sí, sé que depende de tu diseño, pero ¿qué es lo más común?

Esto es lo que tengo actualmente como titular:

h1 { font-size: 24px;} 
h2 { font-size: 22px;} 
h3 { font-size: 18px;} 
h4 { font-size: 16px;} 
h5 { font-size: 12px;} 
h6 { font-size: 10px;} 

Sí, pero aún no el uso de EMS en mi trabajo actual.

Gracias

Answer 1

que dependerá de hoja de estilo por defecto del navegador. Puede ver una tabla (no oficial) de hojas de estilo de agente de usuario CSS2.1 predeterminadas here.

Sobre la base de la página que se indica más arriba, los tamaños predeterminados de ser algo como esto:

IE7  IE8  FF2   FF3   Opera Safari 3.1 
H1 24pt 2em  32px  32px  32px 32px  
H2 18pt 1.5em 24px  24px  24px 24px 
H3 13.55pt 1.17em 18.7333px 18.7167px 18px 19px 
H4 n/a  n/a  n/a   n/a   n/a  n/a 
H5 10pt 0.83em 13.2667px 13.2833px 13px 13px 
H6 7.55pt 0.67em 10.7333px 10.7167px 10px 11px 

También vale la pena echar un vistazo a es el default stylesheet for HTML 4. El W3C recomienda usar estos estilos como el predeterminado. Un extracto abreviado:

h1 { font-size: 2em; } 
h2 { font-size: 1.5em; } 
h3 { font-size: 1.17em; } 
h4 { font-size: 1.12em; } 
h5 { font-size: .83em; } 
h6 { font-size: .75em; } 

Espero que la información sea útil.

Answer 2

Los encabezados son normalmente negrita; que se ha desactivado para esta demostración de correspondencia de tamaño. MSIE y Opera interpretan estos tamaños de la misma, pero en cuenta que los navegadores Gecko y Chrome interpretan la rúbrica 6 como 11 píxeles en lugar de 10 píxeles/tamaño de la fuente 1, y la rúbrica 3 como 19 píxeles en lugar de 18 píxeles/tamaño de la fuente 4 (aunque es difícil de di la diferencia incluso en una comparación directa e imposible de usar). Parece que Gecko también limita el texto a no menos de 10 píxeles.