Apply CSS to classes that have name with numbers

user_2804740 0
Viewed 835

This is the HTML:

<div class="class1">Class</div>
<div class="class2">Class</div>
<div class="class3">Class</div>

CSS is the following:

.class1, .class2, .class3 { ... }

I'm not sure if it's possible, but I'm trying to simplify the css.

Something like:

.class(from1to3) { ... }
css html
4 Answers

If the class name will be the same for all elements, but with different numbers, you can use Attribute Selectors

div[class^="class"],
div[class*="class"] {
  color: red;
}
<div class="class1">Class</div>
<div class="class2">Class</div>
<div class="class3">Class</div>

user_55978340

You can use an attribute selector.

div[class*='class'] {...}

but the best solution i think is:

.class1, .class2, .class3 { ... }

Admin1

use div[class*="class"]

div[class*="class"] {
    background: #ffff00;
}
<div class="class1">Class</div>
<div class="class2">Class</div>
<div class="class3">Class</div>

user_62512320

Consider using SASS or another pre-processor, it would be easier.

user_105625380
Related