CSS3：如何将元素宽度设置为100%减去50px？

terry 2年前 (2023-09-07) 阅读数 218 #CSS

文章标签 CSS3 代码小记

我们可以使用 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

本文仅代表作者观点，不代表Code前端网立场。
本文系作者Code前端网发表，如需转载，请注明页面地址。

◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。