Ao de la Diversificacin productiva y

del fortalecimiento de la educacin

Instituto de Educacin
Superior Tecnolgico
Privado
DOCENTE:
Gino Solano

ASIGNATURA:
Tpicos Informaticos

TEMA:
Hojas de Estilo ( CSS )

CICLO:
VI

ESPECIALIDAD:
Secretariado ejecutivo

INTEGRANTES:
Erika Padilla Braithwaite
Yazmin melina Alor Ramirez
Mishel Zeballos Nube

PRESENTACIN
Una hoja de estilo (style sheets) no es ms que una coleccin de
reglas que afectan a la apariencia de un documento. Estas reglas
se refieren al modo en que aparecer un documento en pantalla
cuando el usuario utilice un navegador o explorador grfico,
controlando por ejemplo el color, el fondo, tipo de fuente, apariencia
de los bordes, mrgenes, alineacin y espacio entre caracteres. El
HTML 4.0 desplaza muchas de las funciones realizadas por las
anteriores versiones hacia las hojas de estilo, reservando el
lenguaje HTML para cuestiones menos formales, relativas a la
propia organizacin del contenido, y lo mismo ocurre con el
lenguaje XML.

Las ventajas que ofrece la utilizacin de hojas de estilo es que se

disean de forma independiente al documento HTML y que se se
pueden aplicar, enteras o alguno de sus niveles, a los documentos
que se desee, facilitando la consistencia y homogeneidad en el
diseo y la imagen del sitio web. Adems, las hojas de estilo se
pueden adecuar a los distintos medios de presentacin de
documentos (pantallas del ordenador, impresoras, televisores,
navegadores basados en voz, documentos en Braille...). El usuario
tambin puede elegir qu tipo de diseo prefiere visualizar en un
mismo documento: desde un formato ms simple o tradicional, a
uno ms sofisticado. Una ventaja adicional es que reducen el
tiempo de carga de las pginas web en el ordenador, puesto que las
hojas de estilo se cargan en el navegador o visualizador, de manera
que al acceder a un documento que incluya la misma hoja de estilo
de otro que se ha "bajado" anteriormente no ser necesario volver a
cargarla, porque ya se encuentra en el ordenador cliente.

Dedicatoria
A nuestros padres que con su
amor incondicional me apoyaron
en todo momento, en nuestros
momentos de fortaleza y de
debilidad, siempre estuvieron
para incentivarme a seguir
adelante.

Pgina
INDICE GENERAL
PRESENTACION -------------------------------------------------------------I
DEDICATORIA
---------------------------------------------------------------II
INDICE
------------------------------------------------------------------------III
INTRODUCCIN
-------------------------------------------------------------IV
1-TEMA
-----------------------------------------------------------------------1
2-HOJAS DE ESTILOS (CSS)
-----------------------------------------------2
3-COLOCACIN FLEXIBLE DE LA INFORMACIN DE ESTILO
------3
4- VENTAJAS DEL CSS
------------------------------------------------------4
5- PORQU SE LLAMAN HOJAS DE ESTILOS CSS?
-------------------5
6-EJEMPLOS DE HOJAS DE ESTILO CSS
---------------------------------6
7-COLOCACIN FLEXIBLE DE LA INFORMACIN DE
ESTILO-------7
CONTENIDOS:

1.1 Resumen General

-----------------------------------------------------8
1.2 Caractersticas de las Hojas de Estilo
Css------------------------9
1.3 Usos de la Css
---------------------------------------------------------10
1.4 Navegadores que lo soportan
--------------------------------------11
1.5 Otra Manera de Definir Estilos en un Archivo
Externo--------12
1.6 Trucos Avanzados en Css-------------------------------------------13

INTRODUCC
El lenguaje HTML est limitado a la hora de aplicarle forma a un documento. Esto es
as porque fue concebido para otros usos (cientficos sobre todo), distinto a los
actuales, mucho ms amplios. Para solucionar estos problemas los diseadores han
utilizado tcnicas tales como la utilizacin de tablas imgenes transparentes para
ajustarlas, utilizacin de etiquetas que no son estndares del HTML y otras.
Estas "trampas" han causado a menudo problemas en las pginas a la hora de su
visualizacin en distintas plataformas. Adems, los diseadores se han visto frustrados
por la dificultad con la que, aun utilizando estos trucos, se encontraban a la hora de
maquetar las pginas, ya que muchos de ellos venan maquetando pginas sobre el
papel, donde el control sobre la forma del documento es absoluto. Finalmente, otro
antecedente que ha hecho necesario el desarrollo de esta tecnologa consiste en que
las pginas web tienen mezclado en su cdigo HTML el contenido del documento con
las etiquetas necesarias para darle forma. Esto tiene sus inconvenientes ya que la
lectura del cdigo HTML se hace pesada y difcil a la hora de buscar errores o depurar
las pginas. Aunque, desde el punto de vista de la riqueza de la informacin y la
utilidad de las pginas a la hora de almacenar su contenido, es un gran problema que
estos textos estn mezclados con etiquetas incrustadas para dar forma a estos: se
degrada su utilidad.
En estas pginas de CSS pretendemos dar a conocer la tecnologa con un enfoque
prctico para que en pocos captulos podis usar las CSS de una manera depurada,
reflejando toda nuestra experiencia en su uso.

HOJAS DE ESTILOS CC.SS

QUE ES UNA HOJA DE ESTILO?
Una hoja de estilo es un archivo de extensin *.CSS (CSS, Cascading Style Sheets =
Hojas de estilo) que contempla definiciones de formato (tipo de fuente, tamao, color
de la fuente, color de fondo, prrafos, etc) de las distintas etiquetas que forman una
pgina *.HTML.
Su principal ventaja es definir un mismo aspecto para todas las pginas de un sitio
web. Se crea una hoja de estilo y se vinculan todas las pginas del sitio web a este
archivo. Cualquier cambio efectuado en la hoja de estilo afecta instantneamente al
formato de todas las pginas vinculadas a la misma.
Cuando desde el editor HTML visual se asocia un formato a un fragmento de texto o
bien se convierte en un enlace lo que realmente se est haciendo es situar ese texto
entre etiquetas HTML para que el navegador lo interprete y visualice adecuadamente.
Ejemplo: Si desde Kompozer seleccionas el texto titular de una pgina web y a
continuacin despliegas la lista de formatos para seleccionar Ttulo 1 (de forma similar
a lo propuesto en las actividades anteriores de este curso), realmente el fragmento de
texto se ha etiquetado como <h1> Texto seleccionado </h1>. Si hubiramos
elegido Ttulo 2 se habra etiquetado con <h2> </h2>, etc.

Algunas etiquetas HTML son:

<body> </body> . Contienen todos los caracteres que

forman la pgina web.
<h1> </h1>,, <h6> </h6>. Permiten definir ttulos
de distintos tamaos (hasta 6).
<p> </p>. Contienen el texto de un prrafo.
<a href=http://...>Texto del enlace</a>. Se utiliza
para crear enlaces.

Existen muchas ms etiquetas pero en esta prctica slo vamos a modificar el

formato (color, tipo, tamao, efecto, etc.) de los textos etiquetados con las que
se citan.

Para qu sirve?
CSS es una especificacin desarrollada por el W3C (World Wide Web Consortium)
para permitir la separacin de los contenidos de los documentos escritos en HTML,
XML, XHTML, SVG, o XUL de la presentacin del documento con las hojas de estilo,
incluyendo elementos tales como los colores, fondos, mrgenes, bordes, tipos de

letra..., modificando as la apariencia de una pgina web de una forma ms

sencilla, permitiendo a los desarrolladores controlar el estilo y formato de sus

documentos.

Cmo funciona?
El lenguaje CSS se basa en una serie de reglas que rigen el estilo de los elementos en
los documentos estructurados, y que forman la sintaxis de las hojas de estilo. Cada
regla consiste en un selector y una declaracin, esta ltima va entre corchetes y consiste en
una propiedad o atributo, y un valor separados por dos puntos.

Selector

Ejemplo:

h2 {color: green;}
h2 ---> es el selector
{color: green;} ---> es la declaracin
color ---> es la propiedad o atributo
green ---> es el valor

Selector:
El Selector especifica que elementos HTML van a estar afectados por esa
declaracin, de manera que hace de enlace entre la estructura del
documento y la regla estilstica en la hoja de estilo.

Declaracin:
La Declaracin que va entre corchetes es la informacin de estilo que indica
cmo se va a ver el selector. En caso de que haya ms de una declaracin
se usa punto y coma para separarlas.

Propiedad o Atributo y Valor:

Dentro de la declaracin, la Propiedad o Atributo define la interpretacin del
elemento asignndosele un cierto Valor, que puede ser color, alineacin,
tipo de fuente, tamao..., es decir, especifican qu aspecto del selector se
va a cambiar.

Tres tipos de estilos:

La informacin CSS se puede proporcionar por varias fuentes, ya sea
adjunto como un documento por separado o incorporado en el documento
HTML, y dentro de estas posibilidades destacan tres formas de dar estilo a
un documento web:

Hoja de Estilo Externa:

La Hoja de Estilo Externa se almacena en un archivo diferente al del archivo
con el cdigo HTML al cal estar vinculado a travs del elemento link, que
debe ir situado en la seccin head. Es la manera de programar ms eficiente,
ya que separa completamente las reglas de formato para la pgina HTML de
la estructura bsica de la pgina.

Hoja de Estilo Interna:

La Hoja de Estilo Interna est incorporada a un documento HTML, a travs del
elementos tyle dentro de la seccin head, consiguiendo de esta manera separar la
informacin del estilo del cdigo HTML.

Estilo en Lnea:
El Estilo en Lnea sirve para insertar el lenguaje de estilo directamente dentro de la
seccin body con el elemento style. Sin embargo, este tipo de estilo no se recomienda
pues se debe intentar siempre separar el contenido de la presentacin.

Versiones CSS:
Existen varias versiones: CSS1 y CSS2, la CSS3 est todava en desarrollo por el
CSS WG (Cascading Style Sheets Working Group).
Los navegadores actuales implementan bastante bien CSS1 desde 1999 (tres aos
despus de su lanzamiento) aunque dependiendo de la marca y versin del navegador
hay algunas pequeas diferencias de implementacin. El primer navegador en dar
soporte completo al CSS1 ha sido Internet Explorer 5.0 for the Macintosh en 2000,
anteriormente el que mejor soportaba CSS1 haba sido Opera, despus otros
navegadores tambin lo han ido implementando.

Sin embargo, CSS2 (lanzado en 1998) slo est parcialmente implementado

en los navegadores ms recientes, variando en estos los niveles de
implementacin.

Ventajas de CSS

La principal ventaja de CSS sobre el lenguaje HTML o similar, es que el estilo

se puede guardar completamente por separado del contenido siendo posible,
por ejemplo, almacenar todos los estilos de presentacin para una web de
10.000 pginas en un slo archivo de CSS.
CSS permite un mejor control en la presentacin de un sitio web que los
elementos de HTML, agilizando su actualizacin.
Aumento de la accesibilidad de los usuarios gracias a que pueden especificar
su propia hoja de estilo, permitindoles modificar el formato de un sitio web
segn sus necesidades, de manera que por ejemplo, personas con deficiencias
visuales puedan configurar su propia hoja de estilo para aumentar el tamao
del texto.
El ahorro global en el ancho de banda es notable, ya que la hoja de estilo se
almacena en cache despus de la primera solicitud y se puede volver a usar
para cada pgina del sitio, no se tiene que descargar con cada pgina web. Por

otro lado, quitando todo lenguaje de marcado en la presentacin en favor del

uso de CSS reduce su tamao y ancho de banda hasta ms del 50%, esto
beneficia al dueo del sitio web con menos ancho de banda y costes de
almacenamiento, Has como a los visitantes para los cuales las pginas se van
a cargar ms rpido.
Una pgina puede tener diferentes hojas de estilo para mostrarse en diferentes
dispositivos, como pueden ser impresoras, lectores de voz, o mviles.

Estilo.En las primeras versiones del HTML, el cdigo fuente de una pgina web
contena tanto la informacin (el contenido) como la forma de representarse (el
diseo o formato). Actualmente, estos dos aspectos se pueden separar. La
pgina web (el documento html) slo debe contener informacin, mientras que
el formato se debe definir en las llamadas hojas de estilo (en ingls, CSS,
Cascading Style Sheets, es decir, Hojas de Estilo en Cascada).

Las ventajas
estilo

de

utilizar

hojas

de

son muchas, sobre todo permiten hacer un diseo consistente y fcil de

modificar. Si varias pginas web hacen referencia a la misma hoja de estilo,
para cambiar la apariencia de un elemento de todas las pginas (por ejemplo,
del encabezado <h1>) es suficiente con hacer los cambios en un nico lugar,
en la hoja de estilo.

Sintaxis de las hojas de estilo

Una hoja de estilo es un fichero de texto plano (sin formato) en el que se define
el aspecto de cada una de las etiquetas de una pgina web.
Una hoja de estilo est formada por una o varias sentencias. Existen dos tipos
de sentencias: las reglas-arroba y las reglas.
Las reglas-arroba empiezan por el smbolo de arroba (@) pegado a un
identificador y terminan por un punto y coma (;).
Las reglas estn formadas por un selector y un bloque de declaracin. El
bloque de declaracin empieza y acaba con llaves { }.
Algunas reglas-arroba (@charset, @import o @namespace) deben aparecer al
principio de la hoja de estilo, pero el resto (@font-face, @media, etc.) pueden
escribirse en cualquier lugar de la hoja de estilo.

Por qu se llaman hojas de estilo?

Con las hojas de estilo podemos crear clases y seudo clases. stas nos
permiten modificar e indicarle al navegador la forma en la que tiene que
presentar cualquier elemento HTML.

HTML 4 soporta las siguientes

caractersticas de hojas de estilo:
Colocacin flexible de la informacin de
estilo
Al colocar las hojas de estilo en ficheros separados es ms fcil reutilizarlas.
Algunas veces es til incluir instrucciones de representacin dentro del
documento al que se aplican, ya sea agrupada al comienzo del documento, o
en atributos de los elementos a lo largo del cuerpo del documento. Para facilitar
la gestin de estilos a nivel de sitio, esta especificacin describe cmo

utilizar los encabezados HTTP para especificar qu hojas de estilo

se aplican a un documento.

Independencia de lenguajes de hojas de

estilo especficos.
Esta especificacin no liga el HTML con ningn lenguaje de hojas de estilo en
particular. Esto permite que se puedan usar otros lenguajes diferentes, desde
los lenguajes ms simples vlidos para la mayora de los usuarios, hasta los
ms complejos, tiles para una minora de usuarios con necesidades muy
especializadas. Todos los ejemplos que se incluyen en lo que sigue se sirven
del lenguaje CSS (Hojas de Estilo en Cascada, Cascading Style
Sheets, [CSS1]), pero tambin son posibles otros lenguajes de hojas de estilo.

Cascada:
Se llama as a la capacidad que proporcionan algunos lenguajes de hojas de estilo
tales como CSS que permiten que las informaciones de estilo provenientes de varias
fuentes puedan combinarse. stas podran ser, por ejemplo, las guas de estilo de una
empresa, los estilos comunes a un grupo de documentos, y los estilos especficos de
un documento en particular.
Al almacenarse independientemente, las hojas de estilo pueden reutilizarse, lo cual
simplifica las tareas de diseo y hace ms efectiva la utilizacin de la memoria cach
de la red. La cascada define una secuencia ordenada de hojas de estilo en la que las
reglas de las ltimas hojas tienen una prioridad mayor que las de las primeras. No
todos los lenguajes de hojas de estilo soportan la cascada.

Dependencias de los medios:

HTML permite a los autores especificar sus documentos de una manera

independiente del medio. Esto permite a los usuarios acceder a las pginas
web usando una amplia gama de dispositivos y medios, p.ej., pantallas grficas
para ordenadores bajo Windows, Macintosh OS y X11, dispositivos para
aparatos de televisin, telfonos adaptados y dispositivos porttiles PDA,
navegadores basados en voz, y dispositivos tctiles Braille.
Las hojas de estilo, en contraste, se aplican a medios o grupos de medios
especficos. Una hoja de estilo diseada para una pantalla puede ser aplicable
para una salida impresa, pero es de poca utilidad para los navegadores
basados en voz. Esta especificacin le permite definir categoras generales de
medios a los que es aplicable una hoja de estilo dada. Esto permite a los
agentes de usuario evitar la descarga de hojas de estilo que no sean
apropiadas. Los lenguajes de hojas de estilo pueden incluir caractersticas para
describir dependencias del medio dentro de una misma hoja de estilo.

Estilos alternativos.Los autores pueden querer ofrecer a los lectores varias maneras diferentes de
ver un documento. Por ejemplo, una hoja de estilo para representar
documentos compactos con fuentes pequeas, o una que especifique fuentes
ms grandes para una lectura ms fcil. Esta especificacin permite a los
autores especificar una hoja de estilo preferente as como hojas alternativas
que se dirijan a medios o usuarios especficos. Los agentes de usuario
deberan dar a los usuarios la oportunidad de seleccionar una de las hojas de
estilo alternativas o incluso de desactivar las hojas de estilo completamente.

Consideraciones de rendimiento.Algunas personas han expresado su preocupacin acerca de los posibles problemas
de rendimiento relacionados con las hojas de estilo. Por ejemplo, la obtencin de una
hoja de estilo externa puede retrasar la presentacin del documento al usuario. Algo
parecido sucede si la cabecera del documento contiene un conjunto muy grande de
reglas de estilo.
La propuesta actual resuelve estos problemas, pues permite a los autores incluir
instrucciones de representacin dentro de cada elemento HTML. As, la informacin de
representacin siempre estar disponible en el momento en que el agente de usuario
quiera representar cada elemento.
En muchos casos los autores sacarn partido de una hoja de estilo comn a un grupo
de documentos. En este caso, la distribucin de reglas de estilo a lo largo del
documento conducir a un rendimiento peor que si se usara una hoja de estilo
vinculada, ya que para la mayora de los documentos la hoja de estilo ya estar
almacenada en la cach local. La disponibilidad pblica de hojas de estilo de calidad
potenciar este efecto.

Aadir estilos al HTML.-

Nota. La hoja de estilo por defecto del HTML 4 que se incluye en [CSS2] expresa la
informacin de estilo por defecto generalmente aceptada para cada elemento. Los
autores, as como los implementadores, pueden encontrar en ella un recurso til.
Los documentos HTML pueden contener reglas de hojas de estilo directamente, o bien
pueden importar hojas de estilo.
Se puede usar cualquier lenguaje de hojas de estilo con HTML. Un lenguaje simple de
hojas de estilo puede ser suficiente para la mayora de los usuarios, pero para otras
necesidades ms especializadas pueden ser apropiados otros lenguajes. Esta
especificacin utiliza para los ejemplos el lenguaje de estilo llamado "Hojas de Estilo
en Cascada" ("Cascading Style Sheets", [CSS1]), abreviado CSS.

Hojas de estilo externas:

Los autores pueden separar las hojas de estilo de los documentos HTML. Esto
ofrece varias ventajas:

Los autores y los administradores de sitios web pueden compartir hojas

de estilo entre varios documentos (y sitios).

Los autores pueden cambiar la hoja de estilo sin necesidad de hacer

modificaciones en el documento.

Los agentes de usuario pueden cargar hojas de estilo selectivamente

(en funcin de los descriptores de medios).

Especificacin de hojas de estilo

externas
Los autores especifican hojas de estilo externas mediante los siguientes
atributos del elemento LINK:

Haciendo el valor de href igual a la localizacin del fichero de la hoja de

estilo. El valor de href es un URI.

Haciendo que el valor del atributo type indique el lenguaje del recurso
(hoja de estilo) vinculado. Esto permite al agente de usuario evitar la
descarga de una hoja de estilo cuyo lenguaje no soporte.

Especificando si la hoja de estilo es persistente, preferente, o alternativa:

Para hacer una hoja de estilo persistente, se hace el atributo rel igual a
"stylesheet" y no se establece el atributo title.

Para hacer una hoja de estilo preferente, se hace el atributo rel igual a
"stylesheet" y se da un nombre a la hoja de estilo mediante el
atributo title.

Para especificar una hoja de estilo alternativa, se hace el

atributo rel igual a "alternate stylesheet" y se da un nombre a la hoja de
estilo mediante el atributo title.

Los agentes de usuario deberan posibilitar a los usuarios ver la lista de estilos
alternativos y escoger uno de ellos. Se recomienda que el nombre de cada
opcin sea el valor del atributo title.
En este ejemplo, especificamos en primer lugar una hoja de estilo persistente
localizada en el fichero Mi Estilo css.
<LINK href="miestilo.css" rel="stylesheet" type="text/css">

Si establecemos el atributo title la convertimos en la hoja de estilo

preferente del autor:
<LINK href="miestilo.css" title="compacto" rel="stylesheet" type="text/css">

Si aadimos la palabra clave "alternate" al atributo rel la convertimos

en una hoja de estilo alterna

<LINK href="miestilo.css"
type="tex

title="Medium"

rel="alternate

EJEMPLOS DE HOJAS DE ESTILOS (CSS)

P{
font-size : 12pt;
font-family : arial,helvetica;
font-weight : normal;
}
H1 {
font-size : 36pt;
font-family : verdana,arial;
text-decoration : underline;
text-align : center;
background-color : Teal;
}
BODY {
background-color : #006600;
font-family : arial;
color : White;
}

stylesheet"

GLOSARIO:
-HIPERVINCULOS:

es un elemento de un documento electrnico que

hace referencia a otro recurso, como por ejemplo otro documento o un punto
especfico del mismo o de otro documento.

- Delegar:

Dar [una persona o un organismo] un poder, una funcin o una

responsabilidad a alguien para que los ejerza en su lugar o para obrar en
representacin suya.

-Sofisticado:

Que se comporta de forma distinguida y elegante, aunque

poco natural.

-Cascada:

es un lenguaje usado para definir y crear la presentacin de un

documento estructurado escrito en HTML o XML2

-Estndar:

Que es lo ms habitual o corriente, o que rene las

caractersticas comunes a la mayora.

-concreto: Que existe, es real, puede

ser percibido por cualquiera de los

cinco sentidos, especialmente por la vista y el tacto.

-Exclusivamente:

Derecho o privilegio por el que una persona o entidad

es la nica autorizada para realizar algo inaccesible a las dems.

-Predeterminada:

Es la configuracin previa que el sistema informtico

usa automticamente a menos que el usuario lo cambie.

-Atributo:

Cualidad o caracterstica propia de una persona o una cosa,

especialmente algo que es parte esencial de su naturaleza.

-Sintaxis:

Cualidad o caracterstica propia de una persona o una cosa,

especialmente algo que es parte esencial de su naturaleza .

RESUMEN GENERAL
Caractersticas y ventajas de las CSS
El modo de funcionamiento de las CSS consiste en definir, mediante una
sintaxis especial, la forma de presentacin que le aplicaremos a: Un web
entero, de modo que se puede definir la forma de todo el web de una sola vez.
Un documento HTML o pgina, se puede definir la forma, en un
pequeo trozo de cdigo en la cabecera, a toda la pgina.
Una porcin del documento, aplicando estilos visibles en un trozo de la
pgina.
Una etiqueta en concreto, llegando incluso a poder definir varios estilos
diferentes para una sola etiqueta. Esto es muy importante ya que ofrece
potencia en nuestra programacin. Podemos definir, por ejemplo, varios tipos
de prrafos: en rojo, en azul, con mrgenes, sin ellos...
La potencia de la tecnologa salta a la vista. Pero no solo se queda aqu, ya
que adems esta sintaxis CSS permite aplicar al documento formato de modo
mucho ms exacto. Si antes el HTML se nos quedaba corto para maquetar las
pginas y tenamos que utilizar trucos para conseguir nuestros efectos, ahora
tenemos muchas ms herramientas que nos permiten definir esta forma:
Podemos definir la distancia entre lneas del documento.
Se puede aplicar identado a las primeras lneas del prrafo.
Podemos colocar elementos en la pgina con mayor precisin, y sin
lugar a errores mucho ms, como definr la visibilidad de los elementos,
marge
nes, subrallados, tachados... Y seguimos mostrandoos ventajas, ya que
si con el HTML tan slo podamos definir atributos en las pginas con
pixeles y porcentajes, ahora podemos definir utilizando muchas ms
unidades como:
Pixels (px) y porcentaje (%), como antes.
Pulgadas (in)
Puntos (pt)
Centmetros (cm)

Navegadores que lo soportan:

Esta tecnologa es bastante nueva, por lo que no todos los navegadores la
soportan. En concreto, slo los navegadores de Netscape versiones de la 4 en
adelante y de Microsoft a partir de la versin 3 son capaces de comprender los
estilos en sintaxis CSS. Adems cabe destacar que no todos los navegadores
implementan las mismas funciones de hojas de estilos , por ejemplo, Microsoft
Internet Explorer 3 no soporta todo lo relativo a capas. Esto quiere decir que
debemos de usar esta tecnologa con cuidado, ya que muchos usuarios no
podrn ver los formatos que apliquemos a las pginas con CSS. As pues,
utilizad las hojas de estilos cuando estas no vayan a suponer un problema.

Usos de las CSS I CSS

Tiene una sintaxis propia, la veremos a travs de ejemplos. Luego se ver con
detalle Vamos ahora a describir los diferentes usos de las CSS introducidos en
el anterior captulo. Vamos por orden, describiendo los puntos segn su
dificultad e importancia. Hemos partido este captulo en dos partes por su
extensin y por haber varias formas distintas de aplicar estilos, aqu veremos
las ms sencillas y en el captulo siguiente otras ms complicadas pero ms
potentes.

Pequeas partes de la pgina

Para definir estilos en secciones reducidas de una pgina se utiliza la etiqueta.
Con su atributo style indicamos en sintaxis CSS las caractersticas de estilos.
Lo vemos con un ejemplo, pondremos un prrafo en el que determinadas
palabras las vamos a visualizar en color verde.

Otra manera de definir estilos en un

archivo externo
Veamos ahora otra manera de importar una declaracin externa de estilos
CSS: @import url("archivo_a_importar.css"), que se utiliza para importar unas
declaraciones de estilos guardadas en la ruta que se indica entre parntesis.
(las comillas son opcionales, pero los parntesis son obligatorios, por lo menos,
en Explorer). Se debe incluir en la declaracin de estilos global a una pgina,
es decir entre las etiquetas, que se colocan en la cabecera del documento. Es
importante sealar que la sentencia de importacin del archivo CSS se debe
escribir en la primera lnea de la declaracin de estilos, algo parecido al cdigo
siguiente.

Trucos avanzados con CSS

Las hojas de estilos son un tema largo del que se han escrito libros enteros.
Nosotros nos centramos en los temas prcticos y por ello vamos a acabar ya
con este captulo, en unos cuantos puntos Definir estilos utilizando clases Las
clases nos sirven para crear definiciones de estilos que se pueden utilizar
repetidas veces. Una clase se puede definir entre las etiquetas.

Existen tres formas gracias a la cual de pueden aplicar

las hojas de estilo:
Utilizando una hoja de estilo externa que estar vinculada a un documento a
travs del elemento <link>, el cual debe ir situado en la seccin <head>.<head>
< link rel=stylesheet type=text/css href=mystyle.css /> < /head>
Utilizando estilos directamente sobre aquellos elementos que lo permiten a
travs del atributo <style>.<p style=color:sienna;margin-left:20px>
Esto es un parrafo con color y margen. </p>

Utilizando el elemento <style>, en el interior del documento al que

se le quiere dar estilo, y que generalmente se situara en la seccin
<head>.<html> <head>.

CONCLUSIONES
:
1.- Desde que se crearon los primeros documentos HTML hasta
nuestros das las pginas Web han cambiado su forma y
presentacin. La estandarizacin en el diseo de las mismas
optimiza su creacin. El uso de las hojas de estilo en cascada por
los desarrolladores Web contribuye a elevar la calidad de la
apariencia de las aplicaciones, con mnimo esfuerzo por parte del
diseador. La calidad del diseo y la estandarizacin contribuye a
que el cliente se sienta ms cmodo al visualizarlo.

2.- Teniendo en cuenta sus mltiples ventajas, en especial la

sencillez de su utilizacin, la aplicacin de las hojas de estilo al
diseo de pginas Web resulta muy conveniente y eleva la calidad
con que los usuarios pueden apreciar un producto acabado que
representa e identifica al desarrollador.

3.- Las CSS constituyen una valiosa herramienta de diseo

Facilitan la tarea de edicin y mantenimiento de los sitios en la Web.
Facilitan el acceso a la informacin a todas las personas Se
complementan con otros lenguajes para lograr una mejor
comunicacin. Permiten estar mejor preparados para los cambios
que se producirn.
4.- Las Hojas de estilo son una herramienta muy poderosa a utilizar
por los diseadores de sitios web. Ellas ofrecen una gran
consistencia en los diseos de las pginas por brindar un mayor
control sobre el esquema y diseo de un correcto acabado de una
pgina Web.

5.- Este trabajo se realiza con el objetivo de mostrar la importancia

del uso de hojas de estilo en las aplicaciones Web. Se presentan
ejemplos bsicos y se discute los beneficios en el funcionamiento y
estandarizacin de los resultados visuales de las pginas Web.

Tambin se tratan aspectos que deben contemplarse para el diseo

de pginas Web con la utilizacin de hojas de estilo.

ANEXOS:

BIBLIOGRAFA
http://www.rcim.sld.cu/revi
sta_19/articulo_pdf/hojasestil
ocascada.pdf
http://www.armada.mil.ve/
portal/documentos/publicacio
nes/ManualCssHojasDeEstilos
.pdf
http://www.redeszone.net/
2014/02/26/curso-de-html-ycss-introduccion-las-hojas-deestilo/
http://es.ccm.net/contents/
156-css-hojas-de-estilo.