CSS calc() 函數(shù)

實(shí)例

使用 calc() 函數(shù)計算 <div> 元素的寬度:

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

運(yùn)行代碼 ?

定義與用法

calc() 函數(shù)用于動態(tài)計算長度值。

需要注意的是，運(yùn)算符前后都需要保留一個空格，例如：width: calc(100% - 10px)；
任何長度值都可以使用calc()函數(shù)進(jìn)行計算；
calc()函數(shù)支持 "+", "-", "*", "/" 運(yùn)算；
calc()函數(shù)使用標(biāo)準(zhǔn)的數(shù)學(xué)運(yùn)算優(yōu)先級規(guī)則；

支持版本：CSS3

瀏覽器支持

表格中的數(shù)字表示支持該函數(shù)的第一個瀏覽器版本號。

"webkit" 或 "moz" 或 "o" 指定的數(shù)字為支持該函數(shù)的第一個版本號前綴。

函數(shù)
calc()	26.0 19.0?-webkit-	9.0	16.0 4.0?-moz-	7.0 6.0?-webkit-	15.0

CSS 語法

calc(expression)

值	描述
expression	必須，一個數(shù)學(xué)表達(dá)式，結(jié)果將采用運(yùn)算后的返回值。

CSS 函數(shù)

其他擴(kuò)展

上一篇：CSS attr() 函數(shù) 下一篇：CSS cubic-bezier() 函數(shù)