CSS

Hojas de Estilo en Cascada

¿Qué es CSS?
Introducción
http://www.w3schools.com/css/css_intro.asp
Mas información de CSS
https://www.w3schools.com/css/
Ejercicio #1 – Estilos en linea
Ejercicio #2 – Estilos en línea
Ejercicio #3 – Estilo interno
Ejercicio #4 - Div

Hacer una segunda división, que tenga:

• Letras Azules
• Fondo Verde
• Un ancho de 300px
Código
de
colores
Capturar colores de páginas web
Ejercicio #5 – Colores
Ejercicio #6 – Posicionamiento flotante

Hacer a la segunda división:

• Flotante a la derecha
Ejercicio #7 - Clear

Al ultimo párrafo agregado

quitar la clase, ver que ocurre
con el texto.
Ejercicio #8 – Posición relativa y opacidad
Ejercicio #9 – z-index

Colocar la segunda división sobre la

primera, con el mismo espacio de la
izquierda (100px)
Ejercicio #9: Con el cambio sugerido
Ejercicio #10 – Posición absoluta

Agregar 2 atributos a la
primera_sección:
- Left : 100px;
- Top: 100px
Ejercicio #10: Con el cambio sugerido
Ejercicio #11 – Posición fija
Ejercicio #12 - Margenes

Agregar el atributo float: left,

a las dos secciones.
Ejercicio #12: Con el cambio sugerido
Ejercicio #13 – Tamaño de margen
superior/inferior y derecha/izquierda

Modificar el margen de la
sección:
Ejercicio #13: Con el cambio sugerido
Ejercicio #14 – Márgenes específicos

Agregar el atributo float: left, a

las dos secciones.
Ejercicio #14: Con el cambio sugerido
Ejercicio #15 – Rellenos
Ejercicio #16 – Rellenos
Ejercicio #17 – Rellenos
Ejercicio #18– Rellenos (body - reset)
Ejercicio #19 – Relleno (parrafo reset)
Ejercicio #20 - Bordes
Ejercicio #21 - Bordes
Ejercicio #22 – id y class

Ejercicio, colocar los cuadrados en una

misma fila, uno al lado derecho del otro.
Ejercicio #22 – id y class
Ejercicio #23 – border-radius

Hacer el cuadrado a un circulo perfecto,

utilizando la propiedad (px / %):
border-radius
Ejercicio #24 - Fuentes
Fuentes Seguras

https://www.w3schools.com/cssref/css_websafe_fonts.asp
Ejercicio #25 – Fuentes Seguras
Fuentes de Google
Ejercicio #26 – Fuentes de Google
Ejercicio #27 – Texto con estilo

Alineado dentro del contenedor

Ejercicio #28 – Alineado de texto
Generador de Texto
Generador de Texto
http://www.blindtextgenerator.com/es
Seudo clases

https://www.w3schools.com/css/css_pseudo_classes.asp
Ejercicio #29 – Seudo clases