css变量有哪些浏览器支持？

"CSS变量（也称为自定义属性）在现代浏览器中得到了广泛的支持。以下是一些主要浏览器对CSS变量的支持情况：

1. Chrome：Chrome 49及以上版本支持CSS变量。
2. Firefox：Firefox 31及以上版本支持CSS变量。
3. Safari：Safari 9.1及以上版本支持CSS变量。
4. Edge：Edge 15及以上版本支持CSS变量。
5. Opera：Opera 36及以上版本支持CSS变量。

需要注意的是，旧版浏览器（如IE11）不支持CSS变量。为了兼容旧版浏览器，可以使用CSS预处理器（如Sass、Less）等工具来模拟CSS变量的功能。

以下是一个示例，展示如何在CSS中定义和使用变量：

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

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

在上述示例中，我们在:root伪类中定义了两个变量--primary-color和--font-size，分别表示主要颜色和字体大小。然后，我们在.container类中使用这些变量。通过使用var()函数，我们可以在CSS中引用这些变量。

总结来说，现代浏览器（如Chrome、Firefox、Safari、Edge、Opera）都支持CSS变量，可以通过在:root伪类中定义变量，并使用var()函数在CSS中引用。然而，为了兼容旧版浏览器，可以考虑使用CSS预处理器等工具来模拟CSS变量的功能。"