CSS 函數參考手冊
- 上一頁 CSS 偽元素
- 下一頁 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() | 插入自定義屬性的值。 |
- 上一頁 CSS 偽元素
- 下一頁 CSS 動畫相關屬性
