CSS calc() 函数
CSS calc() 函数允许在声明 CSS 属性值时执行一些计算。它可以用在如下场合：<length>、<frequency>, <angle>、<time>、<percentage>、<number>、或 <integer>。
实例
使用 calc() 计算 <div> 元素的宽度：
<!DOCTYPE html><html><head><style>#div1 {position: absolute;left: 50px;width: calc(100% - 100px);border: 1px solid black;background-color: yellow;padding: 5px;text-align: center;}</style></head><body><h2>calc() 函数</h2><p>创建一个在整个窗口范围内延伸的 div，div 的每侧和窗口边缘之间的距离为 50px：</p><div id="div1">Some text...</div></body></html>
定义和用法
calc() 函数执行用作属性值的计算。
| 版本： | CSS3 |
|---|
浏览器支持
表格中的数字注明了完全支持该功能的首个浏览器版本。
-webkit-、-moz- 或 -o- 后面的数字表示使用前缀的首个版本。
| 函数 | |||||
|---|---|---|---|---|---|
| calc() | 26.019.0 -webkit- | 9.0 | 16.04.0 -moz- | 7.06.0 -webkit- | 15.0 |
CSS 语法
calc(expression)
| 值 | 描述 |
|---|---|
| expression | 必需。数学表达式。结果会用作属性值。 可使用如下运算符：+ - * / |