Teoría
Teoría

Herencia

La herencia en CSS es el mecanismo por el que los valores de las propiedades de un elemento padre se transmiten a sus descendientes.

Los valores de las propiedades heredables se transmiten a los descendientes, es decir, a los elementos anidados, si no tienen un valor propio. Por ejemplo, basta con asignar el tamaño y el color de la fuente a body para que los elementos de su interior los hereden.

La herencia permite reducir el tamaño de la hoja de estilos. Sin embargo, cuando hay muchos estilos, puede resultar más difícil averiguar de qué elemento padre proviene el valor de una propiedad.

index.html
style.css

HTML

<!DOCTYPE html> <html lang="es"> <head> <title>Herencia</title> <meta charset="utf-8"> <link rel="stylesheet" href="setting.css"> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Título</h1> <ul> <li>Elemento de la lista</li> <li>Elemento de la lista</li> <li>Elemento de la lista</li> </ul> <p>Texto del primer párrafo.</p> <p>Texto del segundo párrafo.</p> </body> </html>

CSS

body { font-family: "PT Sans", sans-serif; } li { }

ObjetivosRealizado

Asigna a todo el texto del sitio el color color: #2980b9; y el tamaño de fuente font-size: 12px;.
Cambia el color de los elementos de la lista a #1abc9c.