0
¿Que es CSS?• CSS es el acrónicmo de CascadingStyle Sheets  (es decir, hojas de estilo en cascada).• También es un lenguaj...
¿Por qué se llaman hojas de estilo?• Con las hojas de estilo podemos crear clases y  pseudoclases. Éstas nos permiten modi...
¿Qué diferencia entre CSS y HTML?• CSS se usa para formatear el contenido  previamente estructurado.• HTML se usa para est...
Tres tipos de Estilos• La información CSS se puede proporcionar por  varias fuentes, ya sea adjunto como un  documento por...
1.-Hoja de Estilo Externa• La Hoja de Estilo Externa se almacena en un  archivo diferente al del archivo con el código  HT...
2.-Hoja de Estilo Interna• La Hoja de Estilo Interna est incorporada a un  documento HTML, a través del  elementostyle den...
3.-Estilo en Línea• El Estilo en Línea sirve para insertar el lenguaje  de estilo directamente dentro de la  secciónbody c...
Ejemplo:• h2 {color: green;}• h2 ---> es el selector• {color: green;} ---> es la declaración  – color ---> es la propiedad...
Selector• El Selector especifica que elementos HTML  van a estar afectados por esa declaración, de  manera que hace de enl...
Declaración• La Declaración que va entre corchetes es la  información de estilo que indica cómo se va a  ver el selector. ...
Propiedad o Atributo y Valor• Dentro de la  declaración, la Propiedad o Atributo define la  interpretación del elemento as...
Etiquetas en CSS• 1. COLOR DE TEXTO: color: red;• 2. COLOR DE FONDO: background-color: black;• 3. REPETIR IMAGEN DE FONDO ...
Etiquetas en CSS• 6. CURSIVA font-style: italic;• 7. SUBRAYADO: text-decoration: underline;• 8. PARRAFO EN MAYUSCULAS: tex...
Hablando de css
Upcoming SlideShare
Loading in...5
×

Hablando de css

137

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
137
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Hablando de css"

  1. 1. ¿Que es CSS?• CSS es el acrónicmo de CascadingStyle Sheets (es decir, hojas de estilo en cascada).• También es un lenguaje de estilo que define la presentación de los documentos HTML.• En esta podemos hablar de fuentes relativas a, colores, márgenes, líneas, altura, anchura, i mágenes de fondo, posicionamiento avanzado y muchos otros temas.
  2. 2. ¿Por qué se llaman hojas de estilo?• Con las hojas de estilo podemos crear clases y pseudoclases. Éstas nos permiten modificar e indicarle al navegador la forma en la que tiene que presentar cualquier elemento HTML. ¿Por qué se llaman "en cascada"?• Cuando creamos un estilo, las especificaciones que se realicen para un determinado elemento serán aplicables a todos aquellos elementos que se encuentren "por debajo" de él atendiendo a un criterio de herencia.
  3. 3. ¿Qué diferencia entre CSS y HTML?• CSS se usa para formatear el contenido previamente estructurado.• HTML se usa para estructurar el contenido.
  4. 4. Tres tipos de Estilos• La información 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.
  5. 5. 1.-Hoja de Estilo Externa• La Hoja de Estilo Externa se almacena en un archivo diferente al del archivo con el código HTML al cal estar vinculado a través del elemento link, que debe ir situado en la secciónhead. Es la manera de programar ms eficiente, ya que separa completamente las reglas de formato para la página HTML de la estructura básica de la página.
  6. 6. 2.-Hoja de Estilo Interna• La Hoja de Estilo Interna est incorporada a un documento HTML, a través del elementostyle dentro de la sección head, consiguiendo de esta manera separar la información del estilo del código HTML.
  7. 7. 3.-Estilo en Línea• El Estilo en Línea sirve para insertar el lenguaje de estilo directamente dentro de la secciónbody con el elemento style. Sin embargo, este tipo de estilo no se recomienda pues se debe intentar siempre separar el contenido de la presentación.
  8. 8. Ejemplo:• h2 {color: green;}• h2 ---> es el selector• {color: green;} ---> es la declaración – color ---> es la propiedad o atributo – green ---> es el valor
  9. 9. Selector• El Selector especifica que elementos HTML van a estar afectados por esa declaración, de manera que hace de enlace entre la estructura del documento y la regla estilística en la hoja de estilo.
  10. 10. Declaración• La Declaración que va entre corchetes es la información de estilo que indica cómo se va a ver el selector. En caso de que haya más de una declaración se usa punto y coma para separarlas.
  11. 11. Propiedad o Atributo y Valor• Dentro de la declaración, la Propiedad o Atributo define la interpretación del elemento asignándosele un cierto Valor, que puede ser color, alineación, tipo de fuente, tamaño..., es decir, especifican qué aspecto del selector se va a cambiar.
  12. 12. Etiquetas en CSS• 1. COLOR DE TEXTO: color: red;• 2. COLOR DE FONDO: background-color: black;• 3. REPETIR IMAGEN DE FONDO EN FORMA HORIZONTAL: background: url("/images/back.jpg") repeat-x;• 4. REPETIR IMAGEN DE FONDO EN FORMA VERTICAL: background: url("/images/back.jpg") repeat-Y;• 5. NEGRITA font-weight: bold;
  13. 13. Etiquetas en CSS• 6. CURSIVA font-style: italic;• 7. SUBRAYADO: text-decoration: underline;• 8. PARRAFO EN MAYUSCULAS: text-transform: uppercase;• 9. LETRA CAPITAL O TEXTO TIPO TITULO: 1.text- transform: capitalize;• 10. ELIMINAR SUBRAYADO DE UN ENLACE: a {• text-decoration: none;• }
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×