CSS盒子

css的盒子模型学习：

                div标签：
                    块级标签，主要是用来进行网页布局的，会将其中的子元素内容作为一个独立的整体存在。
                    特点：
                        默认宽度是页面的宽度，但是可以设置。
                        高度默认是没有的，但是可以设置。(可以顶开)
                        如果子元素设置了百分比的高或者宽，占据的是div的百分比，不是页面的。
                盒子模型：
                    外边距：margin
                        作用：用来设置元素和元素之间的间隔。
                        居中设置：margin:0px auto;上下间隔是0px,水平居中。
                        可以根据需求单独的设置上下左右的外边距。
                    边框：border
                        作用：用来设置元素的边框大小
                        可以单独设置上下左右
                    内边距：padding
                        作用：设置内容和边框之间的距离
                        注意：内边距不会改变内容区域的大小
                        可以单独的设置上下左右的内边距
                    内容区域：
                        作用：改变内容区域的大小。
                        设置宽和高即可改变内容区域的大小。

所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。

CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。

盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。

下面的图片说明了盒子模型(Box Model)：