外边距的重叠:

    垂直外边距的重叠:在网页中相邻的垂直方向在外边距会发生外边距的重叠

    所谓的外边距重叠指兄弟元素之间的相邻外边距会取最大值而不是取和

    如果父子元素的垂直外边距相邻，则子元素的外边距会设置给父元素

浏览器的默认样式

    浏览器为了在页面中没有样式时，也可以有一个比较好的显示效果，所以为很多的元素都设置了一些默认的margin和padding，而它的这些默认样式，正常情况下我们是不需要使用的。所以我们往往在编写样式之前需要将浏览器中的默认的margin和padding统统的去掉

*{margin: 0;padding: 0;

内联元素的盒模型

    盒模型分成内容区，内边距，边框，外边距

    内联元素不能设置width和height

    内联元素不支持垂直外边距

display和visibility

    将内联元素变成块，通过display样式可以修改元素的类型

    inline：可以将一个元素作为内联元素显示

    block: 可以将一个元素设置块元素显示

    inline-block：将一个元素转换为行内块元素- 可以使一个元素既有行内元素的特点又有块元素的特点，既可以设置宽高，又不会独占一行

    none: 不显示元素，并且元素不会在页面中继续占有位置

    使用该方式隐藏的元素，不会在页面中显示，并且不再占据页面的位置

    visibility

    - 可以用来设置元素的隐藏和显示的状态

    - 可选值：

                    visible 默认值，元素默认会在页面显示

                    hidden 元素会隐藏不显示 

    使用 visibility:hidden;隐藏的元素虽然不会在页面中显示，

     但是它的位置会依然保持

overflow

        子元素默认存在父元素的内容区，子元素最大可以跟父元素一样大意外显露，如果子

        元素大小超过了父元素的内容区，超出的内容会在父元素之外显露，这种

        叫做溢出的内容

       visible 默认值，不会对溢出做处理，元素在父元素之外显现出来

        hidden，溢出的内容 不会显现

        scroll 会在父元素添加滚动条，通过拖动的条来查看完整内容

            这个属性不管内容是否溢出，都会添加水平和垂直的滚动条

        auto 会根据需求自动添加滚动条，只需要水平就添加水平，需要垂直就添加垂直，都不需要就都不加

文档流：   处在网页的最低层，表示一个网页中的位置，创建的元素都处于文档流中

元素在文档流中的特点块元素1.块元素在文档流中会独占一行，块元素会自上向下排列2.块元素在文档流中默认宽度是父元素的100%3.块元素在文档流中的高度默认被内容撑开内联元素1.内联元素在文档流中只占自身的大小，会默认从左向右排列，如果一行中不足以容纳所有的内联元素，则换到下一行，继续自左向右。2.在文档流中，内联元素的宽度和高度默认都被内容撑开-->

当元素的宽度的值为auto时，此时指定内边距不会影响可见框的大小，而是会自动修改宽度，以适应内边距

浮动

使用float来使元素浮动，从而脱离文档流

none，默认值，元素默认在文档流中排列

left，元素会立即脱离文档流，向页面的左侧浮动

right，元素会立即脱离文档流，向页面的右侧浮动

文字环绕“

浮动的元素不会盖住文字，文字会自动环绕在浮动元素的周围，所以我们可以通过浮动来设置文字环绕图片的效果