La herencia en CSS es una característica importante que permite aplicar estilos desde un elemento padre a un elemento hijo. Esto significa que si estableces ciertas propiedades de estilo para un elemento, se aplicarán automáticamente a sus elementos descendientes.
A continuación, te explicamos cómo utilizarla:
1. Seleccionar el elemento padre: El primer paso en la utilización de la herencia CSS es seleccionar el elemento padre. Esto se hace generalmente utilizando selectores de CSS, como por ejemplo:
```css
body {
font-family: Arial, sans-serif;
}
```
En este ejemplo, el elemento “body” es el padre.
2. Establecer la propiedad deseada: Después de seleccionar el elemento padre, deberás establecer la propiedad que deseas que sea heredada. En el ejemplo anterior, la propiedad ‘font-family’ es establecida con el valor ‘Arial, sans-serif’.
3. Heredar la propiedad a los elementos hijo: Cualquier elemento hijo dentro del elemento padre seleccionado heredará automáticamente la propiedad establecida. Por ejemplo, si el HTML tiene párrafos, encabezados o divisiones dentro del cuerpo, todos estos elementos heredarán la fuente ‘Arial, sans-serif’.
Un aspecto importante a tener en cuenta es que no todas las propiedades CSS son heredables. Algunas de las propiedades heredables comunes incluyen ‘font-property’, ‘color’ y ‘text-align’. Propiedades como ‘margin’, ‘padding’ y ‘border’ no se heredan.
Si quieres evitar la herencia, puedes sobrescribir los estilos heredados directamente en el elemento hijo. Por ejemplo:
```css
body {
font-family: Arial, sans-serif;
}
