浮动元素:
1. 浮动元素的margin不会被合并;
2. 浮动一个非替换元素,必须指定width,否则,宽度为0(css规范如此,其实在ie中,并不是必须)
3. 被浮动的元素,不论元素的本来类型,都被视为block 元素;
4. 浮动元素的包含块,是最近的块级祖先;
position
1. static ,relative为流中定位,不脱离流.relative只导致位置偏移,兄弟元素仍然按正常布局;
2. fix,absolute,为脱流定位,fix相对于视窗,即 html;
3. static,relative包含块是最近的block,td,inline-block;
4. absolute的包含块,是任何relative,fix,absolute取值的元素,可以是任何类型;
如果是块元素,包含块为其内边框;
如果是行内元素,包含块为其内容区,即inline-height(span),或外边框(img)围成的区域;
如果没有这样的祖先元素,则为初始根元素(html或body);
5. 元素在包含块外面,也是合法的;
6. relative定位后,大小不变。absolute定位后,视为块级元素,所以高宽可变;
7. 如何占据右下角?解:
复制内容到剪贴板
代码:
span.占右下角{position:absolute;top:50%;left:50%;bottom:0px,right:0px;} 注意,top/bottom/left/right是对包含块四边的偏移;
8. 我理解 ,定位布局是在确定包含块大小之后进行的,所以,任何定位不会影响包含块的自动高度: