Introducción " CSS" 1ª Entrega

Hojas de Estilo en Cascada (Cascading Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser pronunciada la información presente en ese documento a través de un dispositivo de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el control total sobre estilo y formato de sus documentos.


CSS se utiliza para dar estilo a documentos HTML y XML, separando el contenido de la presentación. Los Estilos definen la forma de mostrar los elementos HTML y XML. CSS permite a los desarrolladores Web controlar el estilo y el formato de múltiples páginas Web al mismo tiempo. Cualquier cambio en el estilo marcado para un elemento en la CSS afectará a todas las páginas vinculadas a esa CSS en las que aparezca ese elemento.

CSS funciona a base de reglas, es decir, declaraciones sobre el estilo de uno o más elementos. Las hojas de estilo están compuestas por una o más de esas reglas aplicadas a un documento HTML o XML. La regla tiene dos partes: un selector y la declaración. A su vez la declaración está compuesta por una propiedad y el valor que se le asigne.

(Fuente de información extraida de la web:

 http://www.w3c.es/Divulgacion/GuiasBreves/HojasEstilo)

Dicha esta pequeña introducción vamos a comenzar con unos pequeños ejercicios de combinación html y css.

Tenemos el  encabezamiento  que lo resaltamos de color rojo style color red 

Definimos el estado de la página pero especificamos en este caso los <p> o sea párrafos color rojo. Todos los párrafos

Ahí lo podemos observar .

Vamos a crear una hoja de estilo que la voy a llamae style.css. Observamos el enlace :

href= style.css.Todas las modificaciones que le hagamos a la página html como está vinculada a la hoja de style.css que es donde le haremos los cambios directamente

Nos vamos a trabajar el código en style.css y los párrafos los voy a poner de color rojo.

Ahora el cuerpo (body)

Modifico el tipo de escritura del body

Ahora todo lo que hay dentro de blockquote.

Dentro de blockquote configuro mi color,estilo y tipo de fuente. Si nos paramos un poquito ¿realmente que veo? Bien he creado una hoja de estilo donde estoy modificando la págna html desde ahí porque la vinculé. Desde esta hoja de estilo, puedo modificar toda la estructura del código

Ahora hacemos otra modificación de color verde.

Cambiando elementos de la lista

Cambiando enlaces de blockquote de color