1. 犀牛前端部落首页
  2. CSS百科

CSS3:如何设置一个元素的宽度等于100% 减去50px?

我们可以使用CSS3的calc方法, 而不需要去使用IE的expression。

代码如下:

div {
    width: 100%;
    width: -webkit-calc(100% - 50px);
    width: -moz-calc(100% - 50px);
    width: calc(100% - 50px);
}

案例代码: http://jsfiddle.net/thirtydot/Nw3yd/66/

使用calc这个技术可以很容易的实现这个效果,目前以及被IE9和三大主流浏览器所兼容,想要阅读更多可以参考这个网址: http://caniuse.com/calc

MDN: https://developer.mozilla.org/en/CSS/-moz-calc

原创文章,作者:犀牛前端部落,如若转载,请注明出处:https://www.pipipi.net/730.html

发表评论

登录后才能评论