Tutorial CSS. Aprende a decidir como se visualizarán tus páginas web.

¿Te gustaría dominar tus páginas web para que se vean como realmente quieres?

Deja de dar vueltas por internet buscando parches y aprende las bases del diseño web con este tutorial CSS.

Los apuntes, resúmenes de clase, chuletas y ejercicios que encontrarás están pensados para los alumnos del curso IFCD0110 de confección y publicación de páginas web. Pero sirven para todos.

Por cierto, antes de leer este tutorial es conveniente que estés familiarizado con el html.

El tutorial está dividido en 3 secciones principales:

Verás que hay algunos contenidos todavía no terminados y que voy completando el tutorial sin prisa pero sin pausa.

Por este motivo al final de todo verás también una sección de últimos contenidos publicados.

¿A que esperas?

¡Teclado, pantalla y acción!

CSS básico

CSS avanzado

Ejercicios CSS

La siguiente colección de ejercicios y prácticas está ordenada siguiendo el orden de conceptos de este tutorial.

Atención: Los ejercicios que están en texto negro todavía no están publicados.

  1. Separar el css de un html
  2. Uso de selectores  I
  3. Uso de selectores II
  4. Uso de selectores III
  5. Suplanta etiquetas html con css
  6. Corrige los errores
  7. Forzar y romper la herencia.
  8. Prioridad de etiquetas. ¿Cómo se visualizará?
  9. Unidades relativas. ¿Cómo pasará a verse el documento web?
  10. Escalera de colores.
  11. Uso de tipografías web.
  12. Dimensiones reales de cajas.
  13. Hacer banderas con gradientes.
  14. Diferencia entre centrado de texto y centrar cajas con css.
  15. Centrado vertical de un contenido.

Últimos contenidos sobre CSS del blog

En CSS existen una serie de normas que dan prioridad a las instrucciones que afectan a cada etiqueta html en función de su importancia, grado de especificidad y orden de aparición. Veámoslo....

Existen distintas formas de indicar los colores que queremos dar a los elementos de un documento. Básicamente necesitamos dominar los colores RGB, RGBa y Hexadecimal. Se muestran varios ejemplos de uso en CSS....