1:<div id="container"> <div id= "content"> </div> </div> 设置content的margin-top 这个时候container和content会共用,除非设置container 的padding属性
2:Absolute,CSS中的写法是:position:absolute; 他的意思是绝对定位,他是参照浏览器的左上角,配合TOP、RIGHT、BOTTOM、LEFT(下面简称TRBL)进行定位,在没有设定TRBL,默认依据父级的做标原始点为原始点。如果设定TRBL并且父级没有设定position属性,那么当前的absolute则以浏览器左上角为原始点进行定位,位置将由TRBL决定。会脱离文档流
Relative,CSS中的写法是:position:relative; 他的意思是绝对相对定位,他是参照父级的原始点为原始点,无父级则以BODY的原始点为原始点,配合TRBL进行定位,当父级内有padding等CSS属性时,当前级的原始点则参照父级内容区的原始点进行定位。未脱离文档流
3: <div >
<div id = "div1" style="height:100px; width:100px; background-color:#e9e9e9;"> </div>
<div id = "div2" style="height:100px; width:100px; background-color:#e9e9e9; float:left;"></div>
</div>
div1占用了空间,div2会在div1的下方开始显示
<div >
<div id = "div1" style="height:100px; width:100px; background-color:#e9e9e9;"> </div>
<span id = "sp">test</span>
<div id = "div2" style="height:100px; width:100px; background-color:#e9e9e9; float:left;"></div>
</div>
div2 会左上角对齐sp,sp会自动围绕div2显示(所以float为left的div会挤开/无视span贴到父级的左边界,而行框(span)不同于块框,是会识别脱流的浮动框并围绕着它)
4: 内联元素不能设置width,height, margin-top, margin-bottom
任何元素,只要设置了float,那么他就变成了块级元素
一个元素若设置了 position:absolute | fixed; 则该元素就不能设置float,因为已经被重置成了块状元素,div会换行,span不会换行
relative : 原来是什么类型的依旧是什么类型。