美文网首页
css3-指定针对元素的宽度和高度计算-盒模型(4)

css3-指定针对元素的宽度和高度计算-盒模型(4)

作者: 咕叽咕叽_6130 | 来源:发表于2019-07-28 21:42 被阅读0次

    1.box-sizing属性

    可以指定width与height属性指定的宽高值是否包含元素内部的补白区域,以及边框的宽度与高度。
    有两个属性:
    -content-box:只包括content的宽度(默认);
    -border-box:包括content+padding+border

    image.png
    image.png
    在Firefox浏览器,还可在box-sizing属性中指定padding-box:content+padding;

    2.使用box-sizing属性原因

    目的是控制元素的总宽度,如果不使用该属性,样式默认为content-box属性值。
    可以使用border-box设为50%,实现并列显示。

    相关文章

      网友评论

          本文标题:css3-指定针对元素的宽度和高度计算-盒模型(4)

          本文链接:https://www.haomeiwen.com/subject/edqmrctx.html