| 数学函数 | |
| calc() | 执行数学运算,计算 CSS 属性值 |
| max() | 返回一组值中的最大值 |
| min() | 返回一组值中的最小值 |
| clamp() | 将值限制在指定的最小值、首选值和最大值范围内 |
| 颜色函数 | |
| rgb() | 定义红、绿、蓝三原色的颜色值 |
| rgba() | 定义红、绿、蓝三原色及透明度的颜色值 |
| hsl() | 通过色相、饱和度、亮度定义颜色 |
| hsla() | 通过色相、饱和度、亮度及透明度定义颜色 |
| color-mix() | 混合两种颜色并指定混合比例 |
| 渐变函数 | |
| linear-gradient() | 线性渐变(沿直线方向) |
| radial-gradient() | 径向渐变(从中心点向外扩散) |
| conic-gradient() | 圆锥渐变(围绕中心点旋转) |
| 变换函数 | |
| translate() | 平移(水平方向和垂直方向) |
| translateX() | 平移(只在水平方向) |
| translateY() | 平移(只在垂直方向) |
| scale() | 缩放(水平方向和垂直方向) |
| scaleX() | 缩放(只在水平方向) |
| scaleY() | 缩放(只在垂直方向) |
| skew() | 倾斜(水平方向和垂直方向) |
| skewX() | 倾斜(只在水平方向) |
| skewY() | 倾斜(只在垂直方向) |
| rotate() | 旋转 |
| matrix() | 通过 2D 变换矩阵定义复杂的变换效果 |
| perspective() | 设置 3D 变换的透视效果 |
| 滤镜函数 | |
| blur() | 使用高斯模糊 |
| brightness() | 改变亮度 |
| contrast() | 改变对比度 |
| drop-shadow() | 使用阴影 |
| grayscale() | 改变灰度 |
| hue-rotate() | 改变色相 |
| invert() | 反转颜色 |
| opacity() | 改变透明度 |
| saturate() | 改变饱和度 |
| sepia() | 将元素转换为复古色调 |
| 动画函数 | |
| cubic-bezier() | 定义基于贝塞尔曲线的动画缓动效果 |
| steps() | 定义分步动画,使过渡以离散步骤进行 |
| 其他函数 | |
| var() | 引用自定义 CSS 变量的值 |
| url() | 指定外部资源的地址(如图片或字体) |
| attr() | 获取元素指定属性的值,并用于 CSS |
| counter() | 显示计数器的值,通常用于编号 |
给站长反馈
「绿叶网」服务号
放大关注服务号,微信也能看教程。