CSS 函数参考手册
CSS 函数
CSS 函数可用于计算值、操作字符串或颜色、创建复杂的渐变和形状等。
CSS 函数通常用作各种 CSS 属性的值。
| 函数 | 描述 |
|---|---|
| acos() | 返回介于 -1 和 1 之间的数的反余弦值。 |
| asin() | 返回介于 -1 和 1 之间的数的反正弦值。 |
| atan() | 返回介于 -∞ 和 ∞ 之间的数的反正切值。 |
| atan2() | 返回介于 -∞ 和 ∞ 之间的两个值的反正切值。 |
| attr() | 返回所选元素的属性值。 |
| blur() | 对元素应用模糊效果。 |
| brightness() | 调整元素的亮度（更亮或更暗）。 |
| calc() | 允许进行计算以确定 CSS 属性值。 |
| circle() | 定义圆。 |
| clamp() | 设置一个值，该值将根据视口的大小在最小值和最大值之间进行调整。 |
| color() | 允许在特定的指定颜色空间中指定颜色。 |
| color-mix() | 在给定颜色空间中，按给定比例混合两种颜色值。 |
| conic-gradient() | 创建锥形渐变。 |
| contrast() | 调整元素的对比度。 |
| cos() | 返回角度的余弦值。 |
| counter() | 返回命名计数器的当前值。 |
| counters() | 返回命名和嵌套计数器的当前值。 |
| cubic-bezier() | 定义三次贝塞尔曲线。 |
| drop-shadow() | 对图像应用投影效果。 |
| ellipse() | 定义椭圆。 |
| exp() | 返回 E 的指定数 x 次幂 (Ex) |
| fit-content() | 允许根据内容调整元素的大小。 |
| grayscale() | 将图像转换为灰度。 |
| hsl() / hsla() | 使用色相-饱和度-亮度模型 (HSL) 定义颜色；可选地包含 alpha 组件。 |
| hue-rotate() | 对元素应用颜色旋转 |
| hwb() | 使用色相-白度-黑度模型 (HWB) 定义颜色；可选地包含 alpha 组件。 |
| hypot() | 返回其参数平方和的平方根。 |
| inset() | 定义与参考框每一边保持指定内嵌距离的矩形。 |
| invert() | 反转图像的颜色。 |
| lab() | 在 CIE Lab 颜色空间中指定颜色。 |
| lch() | 在 LCH（亮度-色度-色相）颜色空间中指定颜色。 |
| light-dark() | 启用两种颜色值设置，如果用户设置了浅色主题，则返回第一个值； 如果用户设置了深色主题，则返回第二个值。 |
| linear-gradient() | 创建线性渐变。 |
| log() | 返回指定数的自然对数（以 E 为底），或指定底数的对数。 |
| matrix() | 使用六值矩阵定义 2D 变换。 |
| matrix3d() | 使用 4x4 矩阵定义 3D 变换。 |
| max() | 使用逗号分隔的值列表中的最大值作为属性值。 |
| min() | 使用逗号分隔的值列表中的最小值作为属性值。 |
| minmax() | 定义大于或等于最小值且小于或等于最大值的大小范围（用于 CSS 网格）。 |
| mod() | 返回一个数除以另一个数后的余数。 |
| oklab() | 在 OKLAB 颜色空间中指定颜色。 |
| oklch() | 在 OKLCH 颜色空间中指定颜色。 |
| opacity() | 对元素应用不透明度效果。 |
| perspective() | 为 3D 变换元素定义透视视图。 |
| polygon() | 定义多边形。 |
| pow() | 返回一个数 (x) 的另一个数 (y) 次幂的值。 |
| radial-gradient() | 创建径向渐变。 |
| ray() | 定义动画元素应遵循的偏移路径线段。 |
| rem() | 返回一个数除以另一个数后的余数。 |
| repeat() | 在网格中重复一组列或行。 |
| repeating-conic-gradient() | 重复锥形渐变。 |
| repeating-linear-gradient() | 重复线性渐变。 |
| repeating-radial-gradient() | 重复径向渐变。 |
| rgb() / rgba() | 使用红-绿-蓝模型 (RGB) 定义颜色；可选地包含 alpha 组件。 |
| rotate() | 定义元素的 2D 旋转。 |
| rotate3d() | 定义元素的 3D 旋转。 |
| rotateX() | 定义元素绕 x 轴（水平）的 3D 旋转。 |
| rotateY() | 定义元素绕 y 轴（垂直）的 3D 旋转。 |
| rotateZ() | 定义元素绕 z 轴的 3D 旋转。 |
| round() | 根据指定的舍入策略对数进行舍入。 |
| saturate() | 调整元素的饱和度（颜色强度）。 |
| scale() | 定义元素的 2D 缩放。 |
| scale3d() | 定义元素的 3D 缩放。 |
| scaleX() | 水平缩放元素（宽度）。 |
| scaleY() | 垂直缩放元素（高度）。 |
| sepia() | 将图像转换为棕褐色调。 |
| sin() | 返回数字（角度）的正弦值。 |
| skew() | 沿 x 轴和 y 轴倾斜元素。 |
| skewX() | 沿 x 轴倾斜元素。 |
| skewY() | 沿 y 轴倾斜元素。 |
| sqrt() | 返回数的平方根。 |
| steps() | 为动画创建分步计时函数。 |
| tan() | 返回数的正切值。 |
| translate() | 允许沿 x 轴和 y 轴重新定位元素。 |
| translateX() | 允许沿 x 轴重新定位元素。 |
| translateY() | 允许沿 y 轴重新定位元素。 |
| url() | 允许在样式表中包含文件。 |
| var() | 插入自定义属性的值。 |