WEB前端

CSS3中的数学表达式calc使用方法

位置:首页 > WEB前端 > css3教程,2013-12-06
根据CSS的发展史我们可以发现CSS越来越强大,强大的在某些地方可以代替Javascript,极大的简化了WEB的开发.calc()的诞生就很好的说明了这一点.

根据CSS的发展史我们可以发现CSS越来越强大,强大的在某些地方可以代替Javascript,极大的简化了WEB的开发.calc()的诞生就很好的说明了这一点.

calc()它是CSS中函数,这个函数功能允许你使用简单数学计算"+","-","*","/",calc()支持所有简单的基本算术计算如:计算元素长度

  1. div{   
  2.     width:calc(100% - 100px);/*正确*/  
  3.     width:calc(100%-100px);/*错误*/  
  4. }  

注意计算"+"和"-"两边一定要是空格并且其中一个要带有单位,"*"和"/"就可以不是空格,但被除数要带px等单位,除数不能带px等单位,否则calc()不能执行,当然百分比的除外.

这个cacl()是非常的强大,但是它的兼容性并不是很好!这点是非常的遗憾
兼容性:IE9+,Chrome,Firefox,Opera跟Safari不支持calc().

TAGS:CSS3数学表达式calc使用

猜你喜欢

NewHot手机版