css3 clac()方法

标签：新功能   数学   color   ack   移动端   roi   标准   highlight   功能   

calc()从字面上可以把它理解成为一个函数function，英文单词是calculate（计算），是CSS3的一个新功能，用来显示元素的长度。

他的用途就是，如果你有一个元素，加了padding或者border就超出了原来预想的效果，或者把元素盒子撑破，这时我们就可以用calc()了,

注意：

　　1、任何长度值都可以使用calc()函数进行计算；

　　2、 calc()函数支持 "+", "-", "*", "/" 运算；

　　3、 calc()函数使用标准的数学运算优先级规则；

具体用法也很简单：　

.box{width: calc(100%-30px);padding-top: 30px;background-color: lightskyblue;}　

只是现在只有PC的浏览器可以兼容，在IE9+、FF4.0+、Chrome19+、Safari6+都得到较好支，在移动端除了firefox for android 14.0，是没有其他的可以兼容的。

-----------------------------------------------------我是分割线------------------------------------------------------

但是如果你想解决padding或者border造成的额问题，可以给元素加上box-sizing：border-box；这样元素还是原来的大小。不会被撑破。

css3 clac()方法

标签：新功能   数学   color   ack   移动端   roi   标准   highlight   功能   

原文地址：http://www.cnblogs.com/eyed/p/7921604.html