CSS calc() 函数

做了几年的移动开发，写UI界面时，总是受移动端影响，喜欢拿屏幕的宽度-固定值，在刚开始写CSS样式时，适配各种屏幕大小总是在JS中来动态改变控件的宽高，用了calc()感觉很轻松！

一.calc()函数的使用

1.基本语法(calc())
calc()函数可以使用数字属性值来执行加、减、乘、除，四则运算。

.demo {
    width: calc(50%  - 40px);//减
     left:calc(20% + 10px);//加
     width: calc(3  * 10%);//乘
     left:calc(20%  / 3);//除

2.嵌套使用
calc()函数可以嵌套使用。但是，内部函数将被视为简单的括号表达式。

    .demo  {
    width: calc( 100% / calc(100px * 2) );
}

二 .定义和用法

1.需要注意的是，运算符前后都需要保留一个空格；
2.任何长度值都可以使用calc()函数进行计算；
3.calc()函数支持 "+", "-", "*", "/" 运算；
4.calc()函数使用标准的数学运算优先级规则；