Realizar en el siguiente HTML 5 declaraciones de estilo CSS que afecten al mismo elemento, el titular h1, con diferentes puntuaciones de prioridad, e indicar su puntuación como un comentario en el propio HTML:


<!doctype html>

<html>

<head>

<meta charset="utf―8">

<title>Herencia</title>

</head>

<body>

<div id="caja">

<header class="cabecera">

<h1>Cabecera: header</h1>

</header>

</div>

</body>

</html>


Al elemento <h1> se le aplican las siguientes cinco declaraciones.


h1 {color: red;}

h1 {color: lime;}

nav h1 {color: pink;}

#caja header h1 {color: blue;}

#caja .cabecera h1 {color: orange;}


Como su origen e importancia es la misma, se hace una valoración para saber cual predominará.

Para calcular la tupla (lista ordenada de elementos basada en A,B ,C, D) donde:

A= estilo de la línea

B= número de ID

C= número de clases

D= número de marcas HTML


Y el resultado según el cálculo es:


Por puntuación, ganará #caj .cabecera h1 {color: orange;} con 0111 puntos y el titular se muestra de color naranja.


Volver