CSS 盒模型
CSS 盒模型是指在网页布局中，每个元素都被看作是一个矩形的盒子，这个盒子由内容区域、内边距、边框和外边距组成。了解盒模型对于掌握网页布局和设计非常重要。
内容区域
内容区域是盒子中实际显示内容的部分，它的大小由元素的宽度和高度决定。可以通过设置元素的 width 和 height 属性来控制内容区域的大小。
---- - ------ ------ ------- ------ -
内边距
内边距是内容区域与边框之间的空间，可以通过设置 padding 属性来控制。内边距可以分为上、右、下、左四个方向，也可以单独设置某个方向的内边距。
---- - -------- ----- -- ------------- -- ------------ ----- -- --------- -- -
边框
边框是内容区域和内边距之间的边界，可以通过设置 border 属性来定义。边框可以有不同的样式、宽度和颜色。
---- - ------- --- ----- ----- -- --- --------- -- -------------- ---- -- ---- -- -
外边距
外边距是盒子与其他元素之间的空间，可以通过设置 margin 属性来控制。外边距也可以分为上、右、下、左四个方向，也可以单独设置某个方向的外边距。
---- - ------- ----- -- ------------- -- ----------- ----- -- --------- -- -
理解盒模型的概念和属性对于设计网页布局和美化页面至关重要。在实际开发中，灵活运用盒模型的相关属性，可以实现各种各样的布局效果。