• 技术文章 >Web开发 >css教程

    css box-sizing属性是什么

    小妮浅浅小妮浅浅2021-08-23 20:37:24原创5769

    说明

    1、css box-sizing用于改变用于计算元素宽度和高度的默认CSS盒子模型。

    并且可以来模拟不正确支持CSS盒子模型规范的游览器行为。

    2、box-sizing属性可以是三个值之一:content-box、padding-box和border-box。

    content-box,默认值,只计算内容的宽度,border和padding不计入width。

    padding-box,padding计入宽度。

    border-box,border和padding计算在宽度内。

    实例

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            div{
                width: 50px;
                height: 50px;
                margin: 10px;
                padding: 10px;
                border: 10px solid #888;
            }
            #bs{
                box-sizing: border-box;
            }
        </style>
    </head>
    <body>
    <div></div>
    <div id="bs"></div>
    </body>
    </html>

    以上就是css box-sizing属性的介绍,希望对大家有所帮助。更多css学习指路:css教程

    本文教程操作环境:windows7系统、css3版,DELL G3电脑。

    专题推荐:css box-sizing
    上一篇:css中BFC布局规则是什么 下一篇:css link和@import的区别

    相关文章推荐

    • css使用transform垂直对齐• css中position常见的四个属性值• css中sticky属性是什么• css中sticky属性有什么特点• css浮动有哪些特性• css浮动元素的规则介绍• css浮动元素的重叠问题• css中clear属性是什么• css清除浮动的原因• css有哪些清除浮动的方法• css中BFC是什么意思• css中BFC布局规则是什么

    全部评论我要评论

    © 2021 Python学习网 苏ICP备2021003149号-1

  • 取消发布评论
  • 

    Python学习网