CSS selecciona el primer elemento con una cierta clase

¿Cuál es la syntax para seleccionar el primer elemento con una cierta clase? Especifique si ese método de selección es parte de CSS3 o CSS2.1.

Si necesita el primer elemento con cierta clase entre sus hermanos , puede usar

.myclass { /* styles of the first one */ } .myclass ~ .myclass { /* styles of the others (must cancel the styles of the first rule) */ } 

No intente utilizar .myclass:not(.myclass ~ .myclass) para hacer esto en una sola regla, no funcionará ya que :not() solo acepta selectores simples entre paréntesis.

Si desea la primera .myclass en todo el documento, no hay forma de hacerlo solo con CSS.

Los enfoques :nth-of-type() o :nth-child() publicados son incorrectos, incluso si casualmente coinciden con los elementos que desea en su página.

Compatibilidad con el navegador del selector de hermanos (~): IE7 + y todos los demás.

Prueba esto

 .testparent .test:first-child { color: red; } 
test
test
test

la primera ‘prueba’ div tiene solo color rojo.

 .class-name:first-of-type { ⋮ declarations }