1.浮动:浮动能使盒子脱离标准文档流;

四大特性 : 1,浮动的元素脱标;

　　　　　2.浮动的元素互相贴靠;

　　　　    3.浮动的元素有"字围"效果(是文本围绕着浮动盒子显示)

　　　　　4.收缩的效果:将块级元素转化成行内;

大家一定要谨记:关于浮动,我们初期一定要遵循一个原则,永远不是一个盒子单独浮动,要浮动就要一起浮动,另外有浮动一定要清除浮动;

清除浮动的方式:

　　　　1.给父盒子设置高度;

　　　　2.clear : both;

　　　　3.伪元素清除法;

　　　　4.overflow : hidden;

清除浮动的案例:(.clear : both;方法)

              
           
    
         
     
             
      
Python
             
      
web
             
      
linux
             
             
                   
                   
                   
                   
      
         
     
     
    
     
    
     
    
     
       案例2:(伪元素清除法;)

.boss1:after{
      content:"."; 在这里引用了 clear : both     clear:both;     background-color:green;     display:block;     visibility:hidden;     height:0;     width:1000%;     height:1000px;     border:5px solid black; 案例3 : (overflow : hidden;) 这种方法,使用简单.

.boss1{
      overflow:hidden; }

 

2.标准文档流:

　　哪些标签不在标准文档流 : 浮动 , 绝对定位 , 固定定位; 如果不是标准文档流的标签(浮动的标签或者脱标),那它有四个特性 : 

　　　　　　　　　　　　1.浮动的元素脱标;

　　　　　　　　　　　　2.浮动的元素互相贴靠;

　　　　　　　　　　　　3.浮动的元素有"字围"效果;

　　　　　　　　　　　　4.收缩的效果 : 将块级元素转化成行内;

　　　　　　　　　　　　5.不占位置;

清除浮动的标签 : 好处: 1.浮动的元素能实现并排;

　　　　　　　　　　  2.把空白折叠现象清除;

　　　　　　　　　　  3.能撑起父盒子的高度;

　注意 : 浮动的盒子垂直方向上不会出现坍塌问题 .

 

只要盒子浮动了就不区分块级标签还是行内标签.

1.可以任意的设置宽高;

2.坍塌问题不会出现;

 

使用margin : 0 auto 注意点 : 

　　　　1.使用margin : 0 auto ;水平居中,盒子必须有width,要有明确width.    文字水平居中使用text-align : center;

　　　　2.只有标准流下的盒子,才能使用margin : 0 auto ; 当一个盒子浮动了,固定定位,绝对定位,margin : 0 auto ,不能用了; 

　　　　3.margin : 0 auto ; 居中盒子,而不是居中文本,文字水平居中使用text-align : center;