<!-- float:left向左浮动。光使用display:inline-block会产生缝隙 -->
<!-- 给.a和.b设置同一种样式，就可以.a,.b{} -->
<!-- float:left脱离了标准流布局，给父盒子造成了塌陷。必需要在其父元素加上overflow:hidden可以解决造成的塌陷问题，但如果是下拉列表的情况下超出的会隐藏
也可以给父盒子内添加一个div style:clear:both清除两边浮动 -->
<!-- .a:after{ content: '';
display: block;
clear: both;} 这是第四种方式解决盒子塌陷-->
<!-- position的默认值是static 标准流布局展示的 position:aboslute -->
<!-- 因为父元素是aboslute，子元素也是aboslute，子元素会以父元素为基准。但是父元素使用绝对定位脱离文档流。所以标准流布局就会显示在绝对定位的下面。所以使用relative和aboslute相结合的方式 -->
<!-- position:fixed固定定位,与文档流无关，不占据空间 -->
<!-- z-index默认是0，relative，aboslute，fixed都可以用这个提升层级-->
* absolute绝对定位，脱离了标准的文档流，设置之后前面的会被后面的盖住 */
<!-- 内部是绝对定位，父盒子也是绝对定位，就会以父盒子进行定位。如果父盒子不是绝对定位，就会以body为基准定位 -->
