相关链接:https://www.w3cplus.com/css/css-functions.html
CSS Functions
Alphabetical list of CSS functions included in CSS3.
attr()
blur()
brightness()
calc()
circle()
contrast()
counter()
counters()
cubic-bezier()
drop-shadow()
ellipse()
grayscale()
hsl()
hsla()
hue-rotate()
hwb()
image()
inset()
invert()
linear-gradient()
matrix()
matrix3d()
opacity()
perspective()
polygon()
radial-gradient()
repeating-linear-gradient()
repeating-radial-gradient()
rgb()
rgba()
rotate()
rotate3d()
rotateX()
rotateY()
rotateZ()
saturate()
sepia()
scale()
scale3d()
scaleX()
scaleY()
scaleZ()
skew()
skewX()
skewY()
symbols()
translate()
translate3d()
translateX()
translateY()
translateZ()
url()
在网站上搜索了一下,发现 css 函数有不少,尤其是近三年,增加的函数几乎超过过去的总和。
按照「知识完备性」的思路,尝试整理了一下 CSS 函数。
按照功能,分成以下 5 个类别(可能并不完全准确):
1. 图片
- filter
- blur()
- brightness()
- contrast()
- drop-shadow()
- grayscale()
- hue_rotate()
- invert()
- opacity()
- saturate()
- sepia()
- cross-fade()
- element()
- image-set()
- imagefunction()
2. 图形绘制
- conic-gradient()
- linear-gradient()
- radial-gradient()
- repeating-linear-gradient()
- repeating-radial-gradient()
- shape()
3. 布局
- calc()
- clamp()
- fit-content()
- max()
- min()
- minmax()
- repeat()
4. 变形/动画
- transform
- matrix()
- matrix3d()
- perspective()
- rotate()
- rotate3d()
- rotateX()
- rotateY()
- rotateZ()
- scale()
- scale3d()
- scaleX()
- scaleY()
- scaleZ()
- skew()
- skewX()
- skewY()
- translate()
- translate3d()
- translateX()
- translateY()
- translateZ()
5. 环境与元素
- var()
- env()
- attr()