selectors - selector padre css

Coincidir con todos los selectores de clase que comienzan con?

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Hay un selector CSS por prefijo de clase? 4 respuestas

¿Es posible usar un "comodín" para selectores en CSS3?

p.ej.

<div class="myclass-one"></div>
<div class="myclass-two></div>
<div class="myclass-three"></div>

... y luego, mágicamente, configuró todos los divs anteriores en rojo de una sola vez ...

.myclass* { color: #f00; }

¿Posible?

Answer 1

Lo siguiente debería hacer el truco:

div[class^=''myclass''], div[class*='' myclass'']{
    color: #F00;
}

Editar: comodín añadido ( * ) según lo sugerido por David

Answer 2

No es una respuesta directa a la pregunta, sin embargo, en la mayoría de los casos, sugeriría simplemente establecer múltiples clases para cada elemento:

<div class="myclass one"></div>
<div class="myclass two></div>
<div class="myclass three"></div>

De esta forma puede establecer reglas para todos los elementos de myclass y luego reglas más específicas para one , two y three .

.myclass { color: #f00; }

.two { font-weight: bold; }

etc.

Answer 3

Puedes agregar fácilmente múltiples clases a divs ... Entonces:

<div class="myclass myclass-one"></div>
<div class="myclass myclass-two"></div>
<div class="myclass myclass-three"></div>

Luego, en la llamada de CSS a la clase de acción para aplicar los mismos estilos:

.myclass {...}

Y aún puedes usar tus otras clases de esta manera:

.myclass-three {...}

O si quieres ser más específico en CSS así:

.myclass.myclass-three {...}