A continuación mostramos un contexto de elementos en distintos niveles de especificidad 

 <div class="color">
 <ol>
 <li>contenido</li>
 <li><em>ocontenido</em></li>
 <li class="color">contenido </li>
 <li id="color">contenido</li>
 <li>contenido</li>
 </ol>
 </div>

Aquí se indica la sintaxis de cada selector, y el resultado de color que prevalece para cada elemento anterior

  1. .color ol li { negro } .Aquí la clase color actua como elemento de contexto, no como clase. Valor de prevalencia = 3 (1+1+1)
  2. ol li em {texto azul}. El valor de prevalencia también es 3, ya que hay 3 elementos de contexto, pero "em "es más específico que li
  3. ol li.color { naranja } .Aquí la clase color realmente actúa o se contabiliza como clase. Valor de prevalencia = 12 (1+1+10)
  4. #color { texto rojo } . Prevalece el selector "id" sobre todos los demás. Valor de prevalencia = 100
  5. ol li {amarillo}. Prevalencia =2 (1+1). No se cumple el color indicado porque entra en conflicto con el selector nº1, prevaleciendo el color negro de este sobre el amarillo. La explicación es que el nº5 no contiene ningún selector de clase, ni de tipo "id" , ni elementos más específicos que li, por lo tanto es superado en prevalencia por el selector nº1 ya que este especifica un elemento más.