我可以使用一种css变量吗？

Question

我正在尝试整理我网站上的所有css代码,我希望能够具体类型.假设类型为20px,粗体和蓝色,例如

<h1 bold blue>Hello world</h1 blue bold>

所以css文件将具有:

h1 {
font-size:20px;
}

bold {
font-weight:bold:
}

blue {
color:blue;
}

然后,当我完成我的设计过程时,我可以混合搭配颜色和尺寸等.这样的事情可能吗？

Answer 1

这不可能像你想要的那样,但你可以做的是:

<h1 bold blue>Hello world</h1 blue bold> // your idea
<h1 class="bold blue">Hello world</h1>   // correct html, even slightly shorter

和

h1 {
  font-size:20px;
}

.bold {                                  // added . for being a class
  font-weight:bold:
}

.blue {                                  // added . for being a class
  color:blue;
}

当使用像lesscss这样的东西时,css-variables本身是可能的,但是这种方式与你提到的方式不同,你的html-markup仍然必须有效.

编辑:
请注意,正如edem(和其他人)所说,在真实项目中使用blue和bold作为类名不是一个好主意.我假设你刚刚给出了这个简短的例子来询问如何组合不同的"css规则集"(阅读:类).如果不是这样的话:坚持使用edems或tims 解释并查看"语义标记"的指南.