在html页面的div布局中,如果我们把div的宽度当做一个计算公式,让浏览器去自动去计算它们的值是不是很有意思呢?那么今天就说一下,css中的一个关于计算的函数 calc()
calc() 函数介绍
calc():英文单词calculate(计算)的缩写,是 css3 新增加的一个功能。它可以动态的设置元素样式中border、margin、pading以及 width 等属性的值。
calc() 函数定义
1、calc() 函数可以计算任何长度的值
2、calc() 函数支持 " ", "-", "*", "/" 运算;
3、calc() 函数使用标准的数学运算优先级规则;
4、特别要注意的是,运算符前后都需要一个空格。
5、现代浏览器都支持 calc() 函数
calc() 函数的语法
calc(expression)
expression:一个数学表达式,会返回表达式所计算出的值
示例:
width: calc(100% - 10px);
calc() 函数用法示例
示例1:
博客标题