css var()

作者：资本principal 发布日期:2025-04-14 浏览:125

/* 使用 CSS 变量 (自定义属性) */

:root {
  --primary-color: #4CAF50;
  --font-size: 16px;
}

body {
  background-color: var(--primary-color);
  font-size: var(--font-size);
}

button {
  color: white;
  background-color: var(--primary-color);
  font-size: calc(var(--font-size) + 2px);
}

/* 解释说明：
1. `:root` 选择器用于在全局范围内定义 CSS 变量，这些变量可以在整个文档中使用。
2. `var()` 函数用于引用已定义的 CSS 变量。例如，`var(--primary-color)` 引用了 `--primary-color` 变量的值。
3. 可以通过 `calc()` 函数对变量进行计算，如 `calc(var(--font-size) + 2px)`。
*/

上一篇：css作用

下一篇：css left