css

8
CSS=Cascading Style Sheet Cascading significa que la definición de estilos fluye en las etiquetas anidadas. Ejemplo: La aplicación del color rojo a la etiqueta <body> se propagará a otros elementos contenidos en la etiqueta Style significa que se aplicarán estilos a las etiquetas Sheet implica que toda la definición se guardará en una página.

Upload: henry-astudillo-ramirez

Post on 16-Apr-2017

667 views

Category:

Technology


0 download

TRANSCRIPT

Page 1: css

•CSS=Cascading Style Sheet– Cascading significa que la definición de estilos fluye en las etiquetas anidadas.

Ejemplo: La aplicación del color rojo a la etiqueta<body> se propagará a otros elementos contenidos en la etiqueta

– Style significa que se aplicarán estilos a las etiquetas

– Sheet implica que toda la definición se guardará en una página.

Page 2: css

Una especificación para la presentación de documentos complementaria a HTML.

– HTML sirve para describir el contenido de una página Web.

– CSS es como una plantilla que se usa para definir un estilo para un elemento HTML y que se puede aplicar en todos las páginas donde aparezca dicho elemento.

Page 3: css

HTML Tradicional mezcla Presentación y Datos

CSS Separa el contenido de la presentación haciendo mas fácil manejar datos y diseño

Page 4: css

• Ventajas CSS:– Separa contenido de presentación

• Separa la capa de estilo de una página web de los datos y de la información que se muestran en ella.

– Permite especificar la apariencia de todo el sitio web en un único lugar.

• Los estilos para fuentes, tamaños de la fuente, espaciado deletras, colores, y márgenes. Un cambio en un fichero genera cambios en todos los ficheros.

– Puede ser usado para páginas HTML y para XML

• Desventajas CSS:– No todos los navegadores soportan CSS

Page 5: css

La sintaxis general es:

O

Donde:– Selector es cualquier etiqueta HTML o XML afectada por el estilo.– Propiedad y Valor describen la apariencia de las etiquetas.– Los espacios entre los ‘:’ y los ‘;’ son opcionales.– Debe usarse un ‘;’ entre las propiedades, aunque es opcional para la última propiedad.

Page 6: css

H1 { Color : blue Font-size : 18

px }

Page 7: css

Dónde Implementar Estilos:– Inline: Afecta a etiquetas individuales.

– <p><font color=“green”> Texto </font></p>

– Embedded o Internal: Afecta a una única página web:– <style type=“text/css”> P{color:green} </style>– <p> Texto </p>

– External o Linked: Puede afectar a todo el sitio web.• Se pone en un fichero aparte con ext. CSS:

“mihoja.css”• <link rel=“stylesheet” type=“text/css” href=“mihoja.css”>

Page 8: css

http://www.w3schools.com/css/demo_default.htm