Temas > Programacion > Css > Unidades de medida px cm mm em CSS
Julio

Unidades de medida (px, cm, mm, em, etc ...) 
Hasta ahora siempre que hemos especificado tamaños de letra, margin,
padding, border etc. lo hemos hecho a través de pixeles. Esto debido a que
la forma más sencilla de imaginar un tamaño, por lo menos para los que
estamos trabajando todo el día en una computadora, es el tamaño de un
pixel del monitor. Veremos que hay varias unidades de medida para indicar
tamaños y que algunas son más indicadas para algunas situaciones que
otras. Disponemos de las siguientes unidades de medida: px (pixeles) em
(altura de la fuenta por defecto) ex (altura de la letra x) in (pulgadas)
cm (centímetros) mm (milímetros) pt (puntos, 1 punto es lo mismo que 1/72
pulgadas) pc (picas, 1 pc es lo mismo que 12 puntos) % (porcentaje) Un
ejemplo que muestra una serie de párrafos asignando la propiedad font-size
con distintos valores y unidades de medida:
<?php // esto no va
<html> <head> <title>Problema</title> <link rel="StyleSheet"
href="estilos.css" type="text/css"> </head> <body> <p class="pixel1">Este
texto tiene 12 px<p> <p class="pixel2">Este texto tiene 15 px</p> <p
class="em1">Este texto tiene 1 em</p> <p class="em2">Este texto tiene 1.5
em</p> <p class="ex1">Este texto tiene 1 ex</p> <p class="ex2">Este texto
tiene 1.5 ex</p> <p class="in1">Este texto tiene 1 in</p> <p
class="in2">Este texto tiene 1.5 in</p> <p class="cm1">Este texto tiene 1
cm</p> <p class="cm2">Este texto tiene 1.5 cm</p> <p class="mm1">Este texto
tiene 10 mm</p> <p class="mm2">Este texto tiene 15 mm</p> <p
class="pt1">Este texto tiene 10 pt</p> <p class="pt2">Este texto tiene 15
pt</p> <p class="pc1">Este texto tiene 1 pc</p> <p class="pc2">Este texto
tiene 1.5 pc</p> <p class="porcentaje1">Este texto tiene 150%</p> <p
class="porcentaje2">Este texto tiene 200%</p> </body> </html> 
?> // esto no va
La hoja de estilo correspondiente es:
<?php // esto no va
 .pixel1 {  font-size:12px; } .pixel2 {  font-size:15px; } .em1{ 
font-size:1em; } .em2{  font-size:1.5em; } .ex1{  font-size:1ex; } .ex2{ 
font-size:1.5ex; } .in1{  font-size:1in in2{  font-size:1.5in;}.cm1{ 
font-size:1cm;}.cm2{  font-size:1.5cm;}.mm1{  font-size:10mm;}.mm2{ 
font-size:15mm;}.pt1{  font-size:10pt;}.pt2{  font-size:15pt;}.pc1{ 
font-size:1pc;}.pc2{  font-size:1.5pc;}.porcentaje1{ 
font-size:150%;}.porcentaje2{  font-size:200%;}
?> // esto no va
Los especialistas sobre el tema recomiendan utilizar em como medida cuando
la salida es el monitor. Si utilizamos pixeles hay navegadores que no
permiten cambiar el tamaño de texto.













¿Has olviado tu contraseña?

Pulsa aquí para registrate




Google




LunMarMieJueVieSabDom
    123
45678910
11121314151617
181920 21222324
252627282930 

Jueves 21 de Noviembre 2024
Semana 47

..............................................................................................................................................................................................................................................
(Contacto)..
Esta web utiliza cookies para obtener datos estadísticos de la navegación de sus usuarios. Política de privacidad y Aviso legal
Rechazar    Aceptar