css3的calc() css3的百分比减宽,减高,加,乘,除，适合用于后台的排版定位

css3的calc() css3的百分比减宽,减高,加,乘,除，适合用于后台的排版定位

浏览器支持IE9+、FF4.0+、Chrome19+、Safari6+

calc()语法很是简单，就像咱们小时候学加 （+）、减（-）、乘（*）、除（/）同样，使用数学表达式来表示：

.haorooms {
  width: calc(expression);
}

这样padding和margin和百分比一块儿用，问题就能够解决了。

例如，咱们margin是20px。那么咱们就能够写成

.haorooms{
  width: calc(100% - 20px);  //注：减号先后要有空格，不然极可能不生效！！
}

也能够这么用：

.box {
    background: #f60;
    height: 50px;
    padding: 10px;
    border: 5px solid green;
     width: 90%;/*写给不支持calc()的浏览器*/
    width:-moz-calc(100% - (10px + 5px) * 2);
    width:-webkit-calc(100% - (10px + 5px) * 2);
    width: calc(100% - (10px + 5px) * 2);
}