释义
calc()就是在CSS属性中运用四则运算的意思。
它可以用在 width、height、border、margin、padding、font-size 等属性上,任何长度值都可以使用calc()函数进行计算。
语法
.test { width: calc(expression); }
示例
.left {
float: left;
width: 200px;
height: 100%;
}
.right{
float: left;
width: calc(100% - 200px);
height: 100%;
}
运算规则
1、可以使用的运算符号:+
, -
, x
, /
2、可以使用的运算单位:百分比、px、em、rem、vh、vw,且允许各种单位混合使用。
注意事项
1、运算符号加减
前后必须有空格。
2、运算符号乘除
前后建议保留空格。