Сопоставьте любой класс css, начинающийся со строки

Question

Я ищу способ в css для выбора любого элемента с классом, который соответствует началу строки. Я знаю правила [class * = "string"] и [class^= "string"], но это не совсем то, что я ищу.^= соответствует только первому классу, поэтому любые предыдущие классы его сломают. И * = ищет любую часть строки, а не только начало.

http://codepen.io/anon/pen/HiJjL

HTML: 

<div class="asdf col-6">match</div> 
<div class="col-6">match</div> 
<div class="x-col-6">dont match</div> 

CSS: 

[class *= "col-"] { 
    color:red; 
} 
[class ^= "col-"] { 
    font-weight:bold; 
} 

Перо иллюстрирует проблему. Первый селектор слишком широк, второй слишком узкий. Конечно, я могу обойти это с помощью * = и быть осторожным с другими именами классов, но мне было любопытно, если это возможно.

Answer 1

CSS

span[id^='string_'] {} 

HTML

<span id="string_example">string example</span> 

Answer 2

Я не знаю, у такой возможности, но я также думаю, что это не правильный путь. Лучшим решением было бы добавить к элементу несколько классов.

<div class="asdf col col-6">match</div> 
<div class="col col-6">match</div> 
<div class="x-col-6">dont match</div> 

Таким образом, вы можете сказать, что это ДИВ является «цв» (столбец?) И, более конкретно, это «Col-6».