CSS calc() 函數

定義和用法

CSS 的 calc() 函數執行計算，并將結果用作屬性值。

實例

使用 calc() 計算 <div> 元素的寬度：

#div1 {
  position: absolute;
  left: 50px;
  width: calc(100% - 100px);
  border: 1px solid black;
  background-color: yellow;
  padding: 5px;
  text-align: center;
}

親自試一試

CSS 語法

calc(expression)
值 描述
expression

必需。一個數學表達式，其結果將用作值。

可以使用以下運算符：+、-、*、/。

技術細節

版本： CSS3

瀏覽器支持

表格中的數字表示首個完全支持該函數的瀏覽器版本。

Chrome Edge Firefox Safari Opera
26 9 16 7 15

相關頁面

參考：CSS acos() 函數

參考：CSS asin() 函數

參考：CSS atan() 函數

參考：CSS atan2() 函數

參考：CSS cos() 函數

參考：CSS exp() 函數

參考：CSS hypot() 函數

參考：CSS log() 函數

參考：CSS mod() 函數

參考：CSS pow() 函數

參考：CSS sin() 函數

參考：CSS sqrt() 函數

參考：CSS tan() 函數