例えば、.row-1〜row-20まであって全てに同じスタイルを指定したい場合

①20回同じことを書く

②row-0を用意して、row-0とrow-xx（xxは1〜20の値）の両方を指定する

<div class=”row-0 row-20″>のように

③スタイルシートに正規表現を使う

が考えられると思います。２つや３つなら①の方法で同じことを書いちゃう場合もありますが、数が多かったり、HTMLコード側はもう書いてしまっていたり、あるいは、あとからまとめてスタイルを変更する可能性がある場合などは、③の正規表現を使うのがベストですよね～

 

で

 

書き方としては

[class^="row-"] {
    padding-left:20px;
    padding-top:30px;
}

みたいな

 

beforeやafterの疑似要素に対しても使えます

[class^="row-"]:after {
	display: table;
	content: " ";
	clear: both;
}

こんな感じですね。