CSS 函数

最后更新：2026-09-13

CSS 函数

CSS 函数在使用值时进行计算：数学运算、颜色处理、渐变、滤镜以及变量解析等。

数学函数

CSS 函数	说明
`calc()`	混合单位计算，如 width: calc(100% - 20px)。
`min()`	返回一组值中的最小值。
`max()`	返回一组值中的最大值。
`clamp()`	将取值限制在最小与最大之间：clamp(最小, 取值, 最大)。

颜色函数

CSS 函数	说明
`rgb()`	由红绿蓝三通道(0-255)定义颜色。
`rgba()`	在 rgb 基础上增加 0-1 的 alpha 透明度通道。
`hsl()`	以色相、饱和度、亮度定义颜色。
`hwb()`	以色相、白度、黑度定义颜色。
`color-mix()`	在指定色彩空间中混合两种颜色。

渐变函数

CSS 函数	说明
`linear-gradient()`	沿直线方向创建渐变。
`radial-gradient()`	从中心点向外辐射创建渐变。
`conic-gradient()`	围绕中心点旋转创建锥形渐变。

变量与其他

CSS 函数	说明
`var()`	插入自定义属性的值，如 var(--main)。
`url()`	引用图像或字体等资源。
`attr()`	读取元素某属性的值(用途有限)。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。