CSS【框】- 表严肃

https://www.bilibili.com/video/av7293888/index_15.html
@表严肃

框

内容区大小由width和height控制，然后依次是padding、border、margin，如图所示

kuang.jpg

div {
    font-size: 50px;
    background: #ccc;
    width: 200px;
    height: 200px;
    padding: 50px;
    border: 10px solid red;
    margin: 50px;
}

以上代码，依次为：
只设置内容区：width: 200px; height: 200px;
设置内边距：padding: 50px;
设置边框：border: 10px solid red;
设置外边距：margin: 50px;
效果图如下：

kuangtu.jpg