首页  >  取值与单位 Values and Units  >  函数(Functional)  >  calc()

版本 : CSS3 calc()

语法:

calc() = calc(四则运算)

说明:

用于动态计算长度值。
  • 需要注意的是,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px)
  • 任何长度值都可以使用calc()函数进行计算;
  • calc()函数支持 "+", "-", "*", "/" 运算;
  • calc()函数使用标准的数学运算优先级规则;

兼容性:

  • 浅绿 = 支持
  • 红色 = 不支持
  • 粉色 = 部分支持
IEFirefoxChromeSafariOperaiOS SafariAndroid BrowserAndroid Chrome
6.0-8.02.0-3.64.0-18.03.1-5.115.0+3.2-5.12.1-4.318.0
9.0 #14.0-15.0
-moz-
19.0-25.0
-webkit-
6.0
-webkit-
6.0-6.1
-webkit-
4.4-4.4.4 #219.0-25.0
-webkit-
10.0+16.0+26.0+6.1+7.0+26.0+
  1. 当在 background-position中使用calc()时将会导致浏览器崩溃;
  2. 部分版本在使用calc()时,乘法和除法可能无效;