Las hojas de estilo (Style Sheets) son conjunto de instrucciones, a veces en forma de archivo anexo, que se asocian a los archivos de texto y se ocupan de los aspectos de formato y de representación de contenido: tipo, fuente y tamaño de letras, justificación del texto, colores y fondos, etc. Las hojas de estilo permiten liberar la composición del texto de los aspectos visuales y favorecen que se estructure y anote mediante códigos que permiten un tratamiento más eficaz de los contenidos. El uso adecuado de las hojas de estilo es uno de los aspectos clave de la edición digital.
Las hojas de estilo son una herramienta de gran utilidad de los programas de tratamiento de textos, como OpenOffice.org o Microsoft Word. Asimismo, constituyen una parte esencial de los lenguajes de marcas para edición digital: LaTeX, XML y XHTML. Dos lenguajes de hojas de estilo son CSS y XSL.
Las hojas de estilo en cascada o CSS permiten especificar una serie de propiedades de una etiqueta, como la fuente y el tamaño del texto o su situación en la página.
El uso de estilos permite establecer una diferenciación clara entre el contenido de una página y la visualización de la misma.
Hoy en día, por ejemplo, es habitual que una página se muestre en distintos dispositivos como un ordenador de sobremesa, una PDA, un teléfono móvil, etc. Usando una hoja de estilo diferente para cada dispositivo se puede conseguir que la misma página se muestre de forma diferente en cada uno de ellos, adaptándose a sus características particulares.
Definición de estilos mediante hojas de estilo en cascada
Una hoja de estilos define estilos para los elementos HTML. Existen 3 formas de definir estilos:
Ø Mediante estilos individuales
Ø Mediante estilos genéricos
Ø Mediante un enlace a una hoja de estilo externa
En los dos primeros casos los estilos se definen en el propio documento HTML, mientras que en el último se definen en un documento independiente.
Los tres tipos de estilos se pueden utilizar simultáneamente. En tal caso, los estilos individuales tienen prioridad sobre los genéricos, y estos a su vez sobre los externos. Esta definición en “cascada” de los estilos es la que da nombre a las hojas de los estilos.
Estilos individuales:
Los estilos individuales afectan a una sola etiqueta y se colocan con el atributo style.
<etiqueta style= “propiedad: valor; propiedad: valor;…”>
En los estilos individuales, el estilo definido únicamente afecta al elemento para el que se define, y no al resto de elementos del mismo tipo.
Estilos Genéricos:
Para aplicar un estilo a todas las apariciones de un elemento en la página y no a una sola se utiliza un estilo genérico. Los estilos genéricos se definen mediante el elemento style en la cabecera de la página.
<head>
<style type= “text/ccs”>
<!--
h1{
font-size: 24pt;
font-family: arial;
text-align: center;
}
-->
</style>
</head>
Enlace a una hoja de estilos externas:
Los estilos pueden almacenarse en un documento independiente llamado hojas de estilo y enlazarse desde el documento html mediante el elemento link.
<llink rel= “stylesheet” type= “text/ccs” href= “dirección url del css”>
La hoja de estilo es un fichero de texto que contiene únicamente las definiciones de los estilos con el método genérico.
No hay comentarios:
Publicar un comentario