盒子模型

渴望成为大佬

于 2018-10-28 10:53:34 发布

阅读量132

点赞数

分类专栏：前端学习文章标签：盒子模型

本文链接：https://blog.csdn.net/qq_39787515/article/details/83472765

版权

前端学习专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<head>
    <meta charset="UTF-8">
    <title>盒子模型</title>
    <style>
        /*改变默认边框*/
        *{
            margin: 0;
            padding: 0;
        }
        .c1{
            height: 200px;
            width: 300px;
            border: 5px solid green;
            margin-top: 5px;
            margin-right: 10px;
            margin-bottom: 15px;
            margin-left: 20px;
            /*也可以按照上右下左、*/
        }
        .c2{
            height: 200px;
            width: 300px;
            background: red;
        }
    </style>
</head>
<body>
<div class="c1"></div>
<div class="c2"></div>
</body>

     height: 200px;
        width: 300px;
        border: 5px solid green;
        margin-top: 5px;     外边框
        margin-right: 10px;
        margin-bottom: 15px;
        margin-left: 20px;

padding 内边框