css - Multiple Code in a CSS Variable

Question

I think it's a easy question, but i found nothing in google which helps me.

I've the following code:

-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;

Now i use it in more than 1 CSS class. And when i want to change the box-sizing, i don't want to change it in all statements. So i want to use some CSS variable. But i don't find a example to define more than one statement in a CSS variable. Any solution?

What i've already tried:

@boxsizing: 
(
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
)

Answer 1

Vanilla CSS 不会以您希望它们使用的方式使用变量。

对于这种行为，您需要其他工具来从动态代码文件中生成（有效的）CSS。示例包括以下内容：

• 较少的
• SASS

Answer 2

CSS 没有变量之类的东西。您可以通过为多个选择器定义相同的样式来使您的代码更加 DRY，例如：

.boxsizing, #my_element, div, a.foobar {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

Answer 3

你需要像SCSS这样的东西来做到这一点。