Introducción a CSS
De TW
| CSS |
| Introducción a CSS |
| Usando CSS en una página |
| Lenguaje CSS |
CSS (Cascading Style Sheets) es un lenguaje para describir estas propiedades de formato. La mayoría de los browsers modernos pueden interpretar hojas de estilo. Para saber cuales de las propiedades o atributos son soportados en cada browser, puedes revisar la base de datos disponible en West Civ.
Una hoja de estilo se almacena a menudo en forma separada a la página HTML, y es el navegador el que utiliza la información de la hoja de estilo para mostrar la página:
De esta forma, el resultado final que observa la persona en su browser es una mezcla entre las características predefinidas para cada comando HTML y la hoja de estilo. Una de las mayores ventajas de las hojas de estilo es que permiten lograr una presentación muy uniforme, ya que basta definir un estilo una sola vez para que éste se aplique a todos los elementos del mismo tipo que existan en una página.
Ejemplo de hojas de estilo
<HTML>
<HEAD>
<TITLE>Hojas de estilo</TITLE>
<STYLE TYPE="text/css">
BODY {
background: black;
}
H1 {
color: yellow;
font-weight: bold;
font-size: 12pt;
line-height: 14pt;
font-family: "Arial", "Helvetica", sans-serif;
}
P {
color: white;
font-size: 10pt;
line-height: 12pt;
text-indent: 0.5in;
font-family: "Times", serif;
}
</STYLE>
</HEAD>
<BODY>
<H1>Ejemplo de hojas de estilo</H1>
<P>Con hojas de estilo podemos definir características de formato físico para los
elementos HTML estándard.</P>
<P>¡ Hay muchas cosas que se pueden hacer con hojas de estilo y no se pueden hacer
de ninguna otra forma !</P>
</BODY> </HTML>
El uso de hojas de estilo evita el uso excesivo de imágenes, que además de que cuesta mucho hacerlas y mantenerlas a lo largo de las actualizaciones, ocupan bastante más tiempo de transferencia que unas cuantas líneas de código CSS.
Dado que hay una cierta variabilidad entre distintos browsers en materia de hojas de estilo, hay que estar preparado para experimentar y probar cómo se ve una página en distintos browsers.