在No.4中谈及了下盒子模型,引出布局模型
1、布局模型有三类:
1)流动模型 flow(默认)
2)浮动模型 float
3)层模型 layer
2、文档流 :指的是文本沿着从左到右的方向展开,就像流的形式
脱离文档流指的是一个元素脱离文档流之后,其他元素在定位的时候会当作没发现它,两者的位置重叠都是可以的
HTML的布局机制就是用文档模型的,即块元素独占一块
3、对于CSS的浮动float问题 查阅一些资料解释 弄清楚了些 先加个链接 这个对浮动问题总结的比较好http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html
浮动就是脱离文本流,独立于原来的网页之上,浮动的内容就在文档流空间上空独立出来。
上面链接中提到了:
div的顺序是HTML代码中div的顺序决定的。
靠近页面边缘的一端是前,远离页面边缘的一端是后。
所以注意有时候几个div右浮动,123的顺序显示出来却是321,这就是因为上面的原因
清除浮动问题 清除浮动式针对某个div自身设定的, 语法: clear : none | left | right | both
none : 默认值。允许两边都可以有浮动对象
left : 不允许左边有浮动对象
right : 不允许右边有浮动对象
both : 不允许有浮动对象
4、层模型 类似ps中的图层,对某个图层进行准确移动定位,层模型就可以对div模块进行准确的进行定位
定位的类型分为:
1)绝对定位 absolute 脱离文档流
2)相对定位 relative 不脱离文档流
3)固定定位 fixed
4)不定位 static (默认)
今天先做个简单总结,随后补加详细分析