Logotipo de Aprende Gratis.

css - Lección 4: Primeros pasos con css

Es hora de empezar a conocer el lenguaje css; o también llamado lenguaje de hojas de estilo en cascada. Para ello vamos a hacerlo de forma práctica. Se propondrá códigos de trabajo para practicar, y asimilar así todos los conceptos. A partir de los códigos de trabajo, irás cambiando valores, añadiendo declaraciones, etc...

Para comenzar, abre esta página html con la que vamos a trabajar en una ventana/pestaña nueva, copia el código, pégalo en tu blog de notas y guárdalo en tu disco duro con el formato html. Vamos a introducirnos en el diseño modificando las propiedades de los párrafos Si abres el archivo que has guardado con tu navegador verás que la página consta de un título y dos párrafos.

En primer lugar, nos centraremos en los párrafos; por ello, escribiremos el selector css para párrafos y sus llaves. En el siguiente código puedes ver como se escribe.

<style type="text/css">

 p {

  }

</style>

La primera declaración que escribamos será para cambiar el color del texto de los párrafos. Esta declaración se escribe dentro de las llaves. Su escritura es: color:blue;

<style type="text/css">

 p {
   color:blue; /* color del texto */
  }

</style>

La figura 3 muestra como el texto de la página ha cambiado a color azul, tal y como hemos puesto como valor en la propiedad color para el selector p

Cambio a color azul de los párrafos
Figura 3: Cambio a color azul de los párrafos

Con tan solo cambiar el valor de la propiedad del color al selector de párrafos, podemos cambiar el color de los párrafos de nuestra página web. Experimenta con otros valores como green, orange, yellow o purple.


Ir a:


Aprende Gratis 2017 © Mario Raja | página web responsive.