CSS在类属性后具有范围 [英] css having a range after a class attribute

问题描述

我有三类:product1，product2，product3.我可以将CSS添加到所有这些类中，如下所示:

I have three class : product1, product2, product3. I can add css to all these class as follows:

.product1, .product2, .product3{
// add css here
}

但是我正在寻找更简洁的代码来跟踪1到3，后跟'product'并在其中添加CSS.我的期望可以是伪代码示例:

But I am looking for more cleaner code to track 1 to 3 followed by 'product' and add css to these. My expectation can be Pseudocode Examples:

.product1to3{
// fun with css.
}

css中有什么方法吗?

Is there any approach in css?

推荐答案

在您要实现的目标上没有这种CSS伪.

There is no such kind of css pseudo on what you wanted to achieve.

您可以尝试使用SASS实现您想要的.

You can try to use SASS to achieve what you wanted.

，然后使用 @指令

SASS

@for $i from 1 through 3 {
  .product#{$i} { width: 20px; }
}

CSS

.product1 {
  width: 20px;
}

.product2 {
  width: 20px;
}

.product3 {
  width: 20px;
}

---

您还可以尝试使用不用

希望这会有所帮助

这篇关于CSS在类属性后具有范围的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！