CSS属性小知识

1.float

注意：

　　　　1.浮动元素产生了浮动流，块级元素看不到他们，也就是会忽略它所占的位置；

　　　　2.产生BFC的元素和文本类属性的元素以及文本都能看到他们；

　　　　3.有inline-睡醒都具有文本属性

　　　　4.若设置浮动，应该马上清除浮动，避免不必要的影响

清除浮动的方法：

　　　方法一：添加新的元素 、应用 clear：both；一般不可取

　　　方法二：在父级元素设置overflow：hidden；

　　　方法三：伪元素，在父级的 after

　　　　

<div class='father'>
    <div class = 'son'></div>
</div>
<style>
        .son{
             float:left;   
        }    
        .father::after{
             content:"";
             clear:both;
            display:inline-block;
         } 
</style>        

2.position

　　1.absolute

　　　　脱离原来的位置定位，最近有定位的父级定位，如果没有，则相对文档定位；

　　2.relative

　　　　保留原来的位置定位，相对于原来的位置定位

　　注意：

　　　　　　如果元素有position：absolute，float：left/right  浏览器内部会把元素转换成inline-block;

　　　　1.单行文本

　　　　　　三件套：

　　　　　　

<style>
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
</style>

　　　　2.多行文本

　　　　上述方法不好使，只能用overflow：hidden；