美文网首页
css box-sizing属性

css box-sizing属性

作者: CoderZb | 来源:发表于2021-08-16 15:32 被阅读0次

    box-sizing属性有三个值 content-box、border-box、inherit,以下主要介绍前两个值。

    例子:width为100px,边框宽度为20px

    content-box

    设置box-sizing:content-box; 后,总宽度为140px,其中内容为100px,左右边框分别为20px。
    也就是说设置content-box,内容的宽度不受(内、外)边框的影响,始终都是设置的100px。

    border-box

    设置box-sizing:border-box; 后,总宽度为100px,其中内容为60px,左右边框分别为20px

    image.png

    相关文章

      网友评论

          本文标题:css box-sizing属性

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