Búsqueda personalizada
 
 
 
 
Propiedades relacionadas a las fuentes en CSS
 

Las propiedades relacionadas a las fuentes más importantes en CSS son:

  • font-family Define la fuente que se aplicará al elemento HTML. La fuentes más comunes presentes en los navegadores son: Arial, Arial Black, Courier New, Georgia, Impact, Tahoma, Times New Roman, Verdana
  • font-size Define el tamaño de la fuente. Entre otras medias podemos indicarla en píxeles.
  • font-style Podemos indicar alguno de los siguientes valores: normal, italic, oblique
  • font-weight Entre otros podemos indicar los siguientes valores: normal, bold, bolder,lighter

Para probar algunas de estas propiedades confeccionaremos una página que contenga un título de nivel 2 con fuente Arial, un párrafo con fuente de tipo Times New Roman de 14 píxeles en negrita y una serie de párrafos agrupados en un div con tamaño de fuente de 12 píxeles de tipo Verdana:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>ttulo pgina</title>
</head>
<body>
<h2 style="font-family:Arial">Ttulo principal</h2>
<p style="font-family:Times New Roman;font-size:14px;font-weight:bolder">
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
Prrafo en negrita. 
</p>
<div style="font-family:Verdana;font-size:12px">
<p>
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
Primer prrafo. 
</p>
<p>
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
Segundo prrafo.
</p>
</div>
</body>
</html> 

Para el título se debe definer una fuente Arial

<h2 style="font-family:Arial">Título principal</h2>  

Para el primer párrofo seguido al título se debe definir una fuente de tipo Times New Roman de 14 píxeles en negrita

<p style="font-family:Times New Roman;font-size:14px;font-weight:bolder">  

Para el resto de los párrafos agruparlos en un div con tamaño de fuente de 12 píxeles de tipo Verdana

<div style="font-family:Verdana;font-size:12px">  

Solo se a visto los conceptos iniciales de CSS con el objetivo de no tentarse a utilizar los elementos HTML antiguos para asignación de fuentes y colores. Para un estudio ordenado y sitemático puede desarrollar el curso CSS y ver por si mismo las ventajas enormes que presentan las hojas de estilo.

 

 
 
 
 
       

¿Quienes somos?

Condiciones de uso

Publicidad

Privacidad de la informacion