Ejemplo:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Herencia</title>
<style type="text/css">
(1)#caja header h1 { color: blue; }
(2)#caja .cabecera h1 { color: red; }
(3)header h1 { color: lime; }
(4)h1 { color:purple; }
</style>
</head><
<body>
<div id="caja">
<header class="cabecera">
<h1>Cabecera: header</h1>
</header>
</div>
</body>
</html>

PUNTUACION DE CSS

A = ESTILOS DE LINEA
B = NÚMERO DE IDs
C = NÚMERO DE CLASES
D = NÚMERO DE MARCAS HTML

#caja header h1 { color: blue; }
A=0
B=1
C=0
D=2
Total = 0,1,0,2
#caja .cabecera h1 { color: red; }
A=0
B=1
C=1
D=1
Total = 0,1,1,1
header h1 { color: lime; }
A=0
B=0
C=0
D=2
Total = 0,0,0,2
h1 { color:purple; }
A=0
B=0
C=0
D=1
Puntuación = 0,0,0,1

el estilo ganador es el que posee mas puntuacion en el total en este caso es el numero 2.
el resultaod es: