CSS函數(shù)公式作為CSS中的重要組成部分，經(jīng)常被用來描述樣式規(guī)則中的數(shù)值計算，尤其是在響應(yīng)式設(shè)計中。

@media (min-width: 768px) {
.box {
width: 100% - 20px;
}
}

上面代碼展示了一個使用CSS函數(shù)公式計算元素寬度的例子。它通過關(guān)鍵字“calc”將一個百分比值和像素值相減得到一個新的像素值。注意，當使用CSS函數(shù)公式時，必須在操作符兩邊添加空格。

.box {
height: var(--height) * 2;
width: calc(min(100%, var(--width)));
}

上述代碼展示了兩個常見的CSS函數(shù)公式：var() 和 calc()。 var() 函數(shù)接受一個自定義屬性值，并將其作為值返回到CSS規(guī)則中的其他屬性中。calc() 函數(shù)接受數(shù)學表達式并計算表達式中的值。

.box {
background: linear-gradient(90deg, var(--color-light), var(--color-dark)) center;
}

在以上代碼中，我們使用了另一個常見的CSS函數(shù)公式：linear-gradient()。該函數(shù)用于在元素的背景上創(chuàng)建一個色彩漸變。在此例中，我們定義了從左到右的90度的線性漸變。

CSS函數(shù)公式可以實現(xiàn)各種復雜的樣式計算。了解常見的CSS函數(shù)公式，將有助于開發(fā)人員更好的控制網(wǎng)站的樣式和布局。