Vista del Documento HTML:
Estilos Declarados:
- En línea: style="color: darkblue;" || Puntuación: 1,0,0,0
- Por ID: #caja h1 { color: blue; } || Puntuación: 0,1,0,1
- Por Clase: #caja .cabecera h1 { color: red; } || Puntuación: 0,1,1,1
- Por Marca: header h1 { color: lime; } || Puntuación: 0,0,0,2
- Por Último declarado: h1 { color: purple; } h1 { color: darkorange; } || Puntuación: 0,0,0,1
Pruebas:
Gana por en línea: "style="color: darkblue;"
Gana por id: "caja"
Gana por clase: "cabecera"
Gana por marca HTML: "header h1"
Gana por último declarado: "h1 { color: darkorange; }"
Ejercicio:
Realizar en el siguiente HTML 5 declaraciones de estilo CSS que afecten al mismo elemento, el titilar h1, con diferentes puntuaciones de prioridad, e indicar su puntuación como un comentario en el propio HTML:
<!doctype html>
<html>
<head>
<meta charset="utf8">
<title>Herencia</title>
</head>
<body>
<div id="caja">
<header class="cabecera">
<h1>Cabecera: header</h1>
</header>
</div>
</body>
</html>