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:
<style type="text/css">
h1 {color: green;} /* 0,0,0,1 elemento h1 */
header h1 {color: blue;} /* 0,0,0,2 elementos header y h1 */
header {color: yellow;} /* 0,0,0,1 elemento header */
div header h1 {color: gray;} /* 0,0,0,3 elementos div, header, y h1*/
#caja header {color:black;} /* 0,1,0,1 id caja, elemento header */
#caja header h1 {color:purple;} /* 0,1,0,2 id caja, elementos header y h1*/
#caja .cabecera h1 {color:red;} /* 0,1,1,1 id caja, clase cabecera, elemento h1 <----------Ganador será de color rojo-------->*/
.cabecera h1 {color:brown;} /* 0,0,1,1 clase cabecera, elemento h1 */
</style>
<!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>
Cabecera: header