html - 我可以使用一种 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 变量本身是可能的，但这与您提到的方式不同，您的 html 标记仍然必须有效。

编辑:
请注意，作为 edem (and others) said , 在实际元素中使用 blue 和 bold 作为类名并不是一个好主意。我假设您只是将此作为简短示例给出，以询问如何组合不同的“css 规则集”(阅读:类)。如果不是这种情况:坚持 edems或 tims explanation并查看“语义标记”指南。