Сопоставьте все селекторы классов, которые начинаются с?

Можно ли использовать "подстановочный знак" для селекторов в CSS3?

например.

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

... и затем волшебным образом установите все вышеперечисленные divs красным за один раз...

.myclass* { color: #f00; }

Возможные?

Ответ 1

Следующее должно сделать трюк:

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

Изменить: добавлен шаблон (*), предложенный Дэвидом

Ответ 2

Это не прямой ответ на вопрос, однако я бы предложил в большинстве случаев просто задать несколько классов для каждого элемента:

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

Таким образом вы можете установить правила для всех элементов myclass, а затем более конкретные правила для one, two и three.

.myclass { color: #f00; }

.two { font-weight: bold; }

etc.

Ответ 3

Вы можете легко добавить несколько классов в divs... Итак:

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

Затем в вызове CSS классу share примените те же стили:

.myclass {...}

И вы все равно можете использовать свои другие классы следующим образом:

.myclass-three {...}

Или, если вы хотите быть более конкретным в CSS, например:

.myclass.myclass-three {...}