Foros del Web - Ver Mensaje Individual - Duda Sobre Css

kseso? · #12 (**permalink**) 09/02/2011, 15:02

Siento disentir en algún aspecto, sanxuan.
mariomon17, pruebe el siguiente código:

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>css y font-size por Kseso?</title>
<style type="text/css">
* { margin:0; padding:0; position: relative;}
body {font-size:18px;}
p {font-size: 1.3em}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet consectetuer dolor sed gravida id orci. Morbi dui cursus a id mattis urna Nullam nascetur libero nec. Phasellus Ut lacinia Quisque mi in orci interdum dolor accumsan sapien. Donec cursus id arcu dui dolor Vestibulum semper nibh ut Curabitur. Et pellentesque netus tincidunt montes et eros Nulla vel laoreet Sed. Non mauris auctor laoreet pede id feugiat ac odio.</p>
</body>
</html>

y cambia en valor de font-size en body.

Verás que el del párrafo también cambia su tamaño.
Em es el tamaño (altura) de la letra /M/ en la fuente definida para font-family.
Por la ley de la herencia (estilos en cascada), al encontrar en un elemento el tamaño definido en /em/ el agente de usuario se remonta hacia arriba* en busca de un valor para hacer el cálculo correspondiente.
Si en ningún momento lo encuentra, el punto final es el valor en px definido por el usuario en las preferencias de su navegador.
En el caso de ff:

Pero ese remonte cesa en el momento de encontrar un valor ya computado (calculado y pasado a px). Por lo que si en el body define un valor en px, ese será el que utilizará como referente.
Ese es un pequeño truco (incoherente) que utilizan algunos para controlar en tamaño de la tipografía, en detrimento de la accesibilidad.

* : realmente lo que ocurre, explicado de una forma sencilla y por lo tanto algo inexacta, es que el navegador calcula una sóla vez la equivalencia inicial 1em=Xpx y en base a ese valor realiza las conversiones posteriores descendientes cada vez que se encuentra un valor relativo.

GaDo:
Haga lo mismo que le sugiero a mariomon17.
En el código sustituya el valor de font-size por small, y vea qué ocurre.
Pero no le recomendaría definir ese valor para body, por la interpretación que hacen los navegadores de esos valores "subjetivos", así como los numéricos de 100 a 900 para el font-weight.