美文网首页
盒子模型详解

盒子模型详解

作者: 琪33 | 来源:发表于2018-04-25 10:54 被阅读0次
    <style>
            div{
                width: 200px;
                height: 200px;
                background-color: red;
                margin-top:20px;
            }
            .box2,.box3{
                border:25px blue solid;
                padding:25px;
                /* 设置的放内容区域大小*/
                /*外加模式*/
                box-sizing: content-box;
            }
            .box2{
                /* 设置盒子模型中最大盒子大小,如果在加paddig border 只会减小放内容的区域*/
                /*内减模式*/
                box-sizing: border-box;
            }
        </style>
    </head>
    <body>
        <div class="box1"></div>
        <div class="box2"></div>
        <div class="box3"></div>
    </body>
    

    相关文章

      网友评论

          本文标题:盒子模型详解

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