CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web CSS: cómo se usa en HTML...

15
CSS Introducción al desarrollo web http://idesweb.es/ CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos Universidad de Alicante (España) IDW-CSS-02-01

Transcript of CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web CSS: cómo se usa en HTML...

Page 1: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

CSS: cómo se usa en HTML (parte 1)

Sergio Luján Mora

Departamento de Lenguajes y Sistemas Informáticos

Universidad de Alicante (España)

IDW-CSS-02-01

Page 2: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Contacto • http://gplsi.dlsi.ua.es/~slujan/

• http://accesibilidadenlaweb.blogspot.com.es/

• http://accesibilidadweb.dlsi.ua.es/

• http://desarrolloweb.dlsi.ua.es/

• http://www.youtube.com/user/sergiolujanmora

[email protected]

• @sergiolujanmora

Page 3: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

CSS

Cascading Style Sheets

Page 4: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Acoplamiento

Page 5: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

El acoplamiento informático indica el nivel de dependencia entre las unidades de software de un sistema informático, es decir, el grado en que una unidad puede funcionar sin recurrir a otras; dos funciones son absolutamente independientes entre sí (el nivel más bajo de acoplamiento) cuando una puede hacer su trabajo completamente sin recurrir a la otra. En este caso se dice que ambas están desacopladas.

Page 6: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Desacoplamiento total

Page 7: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Reducir el acoplamiento

Page 8: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Page 9: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Atributo style Etiqueta <style> Etiqueta <link>

Page 10: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Atributo style

Page 11: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Page 12: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Page 13: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

Demostración

Page 14: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

color background-color

font-family font-size

Page 15: CSS: cómo se usa en HTML - 01 · CSS Introducción al desarrollo web  CSS: cómo se usa en HTML (parte 1) Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos

CSS

Introducción al desarrollo web http://idesweb.es/

http://idesweb.es/

[email protected] @idesweb