web前端学习笔记，实践篇（四）CSS布局

在实际项目的开发中，我们用到的，可能最多的布局方式，是浮动布局。其实布局，还有一种，绝对定位。

在网页技术中，我们可以把整个所视见的平面，看做是一张纸，而我们所需要画的格子，则可以通过float这个属性，来排列。float有四个属性， 分别为left、right、inherit、none。在编写基于浮动的页面时，应该还需要注意清除浮动，需要定义一个样式 类。.clear{clear:both;}。如何清除浮动？只需要在结构中，添加一行空的结构，例子：

　　<结构一>

　　<结构二>

　　

在浮动布局中，left属性，则是在游览器最左侧。right属性，则是在游览器最右侧。建议：在同dom中，最好不要left right混搭，应该以一个属性为基准。

绝对定位，这种布局方式，更多的是出现在DHTML中，它的属性义所在范围仅在父结构中所定义的position:relative;中。例子如下：

position:absolute; position:relative;属性，都有四个可选的值，分别是top left right bottom，它们分别与离它最近的父容器的relative属性挂钩。当然，值有正负。

.nav{width:965px; height:100px; position:relative;}

.dell{width:200px;height:200px;position:absolute;}

　　

dell这个div，它可以在宽为965px，高为100px的div中活动（可以想象一下，它是在其中活动的，四个坐标选值。）

补充：position属性中还有一个选值,position:fixed 它的作用，是定义固定在游览器中，不会随着滚动而【跑路】。