简单谈谈浮动(小白必看)

1、如何清除一个标签的子标签的浮动？

清除浮动的几种方法：

	后面的元素父盒子加上 clear:both;盒子还是没有高度，margin 失效；父元素有高度，
此时就没有浮动的影响了；

	父 元 素 如 果 不 愿 意 设 置 固 定 死 的 高 度 ， 而 是 自 动 适 配 ， 就 写
overflow:hidden;_zoom:1;

	两个盒子之前加上一个<div class="cl"></div> .cl{clear:both}，隔墙法，盒
子还是没有高度。
	盒子加上::after{content:"",clear:both;} ，内墙法，这个元素自己最后的子元
素是一个标准流元素，所以一下子给这个父盒子撑高了。特别好用。

2、描述一下浮动会造成什么影响，如何居中一个浮动元素？

	【脱标】浮动的元素脱离标准文档流，
	【贴边】左浮动就会贴左边，又浮动贴右边，贴上一个兄弟元素的边，
	【字围】字会环绕这个浮动元素，
	【收缩】不区分行内元素和块级元素了，原来的行内元素现在可以设置宽度、高度，
原来的块级元素如果不写 width 现在会自动缩减为内容宽度。
	浮动的元素要想居中，必须相对定位。相对定位利用 margin-left:50%; left:-宽度一半。
原理就是 margin-left:50%;此时元素的左边线就会到屏幕中线，拉回自己的width 一半即可。
所以要用相对定位拉动。或者 transform:translate(-50%,0);也可以 left:50%; margin-left:宽度一半

3、简单说明绝对定位和浮动的区别和应用。

	绝对定位脱离标准文档流，它的参考点是文档的左上角或者右上角。
	
	如果有任何父元素有定位属性，此时就依据“子绝父相”规则来设置自己的定位参考元素。

	在做网页时候非常的灵活方便。制作覆盖效果的时候，会大量使用绝对定位。
	
	浮动脱离标准文档流，通常用于制作并排显示的元素，通常用于大的布局，或者无序列表比如图片的并排。

	可以使用 clear:both 属性让标准流中的其他元素在此之后依次排列。

4、当 float 和 margin 同时使用时，如何解决 IE6 的双倍边距？

	当浮动的方向和 margin 是同方向的时候，此时 IE6 会在这个方向的第一个元素身上产生双倍 margin。
	
解决方法：

	1) 改变 margin 的方向，float:left; margin-right:20px; 浮动向左，margin 向右
	
	2) 给第一个元素单独写一个类叫做.no1 此时.no1{_margin-left:一半的margin;}
	
	3) 用 display:inline;不用浮动了