Concepto de casada

Actividad 15.

1. Realice un ejercicio práctico donde utilice y se aplique la jerarquía del código CSS
Dependiendo del lugar donde se utilice.
-

concepto de cascada.css
cascada.html

2. Extraiga ideas importantes del video para socializarlas en formación.

- los tipos de selectores que hemos visto son dos: los selectores de tipo de como h3. Y hace que
tolos los h3 que estén en HTML tengan los mismos valores.
h3 {}
- Y también hemos vistos los selectores de clases que llevan un punto y luego el nombre de la
clase y un color red, se añade a un elemento y se importa.
. rojo {}
- Y el nuevo tipo de selector el cual vamos a ver hoy son los selectores id, se escriben con hash o
cuadrado con el nombre cabecera (un nombre típico) y con lo que quisiéramos agregarle al
Código.
#cabecera {}
Las principales diferencias sobre “clases” e “id” es que las clases están echas y pensadas para
poder reutilizarlas. Sin embargo, las id están echas para usarse una única vez.

Y por último los selectores de tipo compuestos: son selectores compuestos con id y tipo.
H5#indice {}
p.párrafo {}
En un primer nivel de simplicidad, la cascada en las hojas de estilo significa que el orden de las
reglas importa en CSS: cuando dos reglas tienen la misma especificidad, se aplica la que aparece
en último lugar en el CSS.

En el ejemplo siguiente tenemos dos reglas que pueden aplicarse al h1. El h1 acaba siendo de
color azul porque estas normas tienen un selector idéntico y, por lo tanto, tienen la misma
especificidad. Por esta razón, se aplica la última que aparece.

Esto es cascada :D
h1 {
color: red;
}
h1 {
color: blue;
}
<h1> esto es cascada :D</h1>

Las hojas de estilo se llaman hojas de estilo "en cascada" porque:

- Las propiedades de estilo pueden estar escritas en varios sitios (en varios lugares de la página
web o de la hoja de estilo) y dependiendo del sitio, afectan a más o menos elementos.

- Cuando un elemento está contenido en otro (por ejemplo, un párrafo <p> dentro de una

división <div>), al elemento de dentro se le aplican también las propiedades definidas para el
elemento de fuera (al párrafo <p> se le aplicarían las propiedades definidas para la
división <div>).

- Dos reglas distintas pueden ser de aplicación a un mismo elemento (por ejemplo, a un
párrafo <p> con clase nombre, le es de aplicación tanto el selector .nombre como el selector p).

Si las propiedades (escritas en diferentes sitios o para diferentes elementos) no entran en

conflicto, el navegador aplica todas las propiedades. Por ejemplo, si el color de fondo de un
elemento está definido en un sitio y el tamaño de letra en otro sitio, el navegador aplicará ambas
propiedades al elemento.
Pero si las propiedades entran en conflicto (por ejemplo, el color del fondo del elemento está
definido en varios sitios con colores distintos), existen reglas para decidir qué propiedad tiene
preferencia.