div+css技术，网页前端必学技术。

1、大家可以从这看起实例当看到“第12天:校验及常见错误”时你会对Div+Css有一定的了解现在咱先来看一些比较常用属性font字体color颜色font-size字体大小text-align文本位置background背景margin外补丁padding内补丁border边框float布局这些在苏昱的Css手册（这是HTML版）里边都可以找到，可以具体看看。

2、CSS布局常用的方法：float:none|left|right取值：none:默认值。对象不飘浮left:文本流向对象的右边right:文本流向对象的左边它是怎样工作的，看个一行两列的例子xhtml代码：<divid="wrap"><divid="column1">这里是第一列</div><divid="column2">这里是第二列</div><divclass="clear"></div>/*这是违背web标准意图的，只是想说明在它下面的元素需要清除浮动*/</div>CSS代码：#wrap{width:100;height:auto;}#column1{float:left;width:40;}

3、#column2{float:right;width:60;}.clear{clear:both;}position:static|a芟鲠阻缒bsolute|fixed|relative取值：static:默认值。无特殊定位，对象遵循HTML定位规则absolute:将对象从文档流中拖出，使用left，right，top，bottom等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象，则依据body对象。而其层叠通过z-index属性定义fixed:未支持。对象定位遵从绝对(absolute)方式。但是要遵守一些规范relative:对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置它来实现一行两列的例子xhtml代码：<divid="wrap"><divid="column1">这里是第一列</div><divid="column2">这里是第二列</div></div>CSS代码：#wrap{position:relative;/*相对定位*/width:770px;}#column1{position:absolute;top:0;left:0;width:300px;}#column2{position:absolute;top:0;right:0;width:470px;}他们的区别在哪?显然，float是相对定位的，会随着浏览器的大小和分辨率的变化而改变，而position就不行了，所以一般情况下还是float布局！CSS常用布局实例单行一列body{margin:0px;padding:0px;text-align:center;}#content{margin-left:auto;margin-right:auto;width:400px;}两行一列body{margin:0px;padding:0px;text-align:center;}#content-top{margin-left:auto;margin-right:auto;width:400px;}#content-end{margin-left:auto;margin-right:auto;width:400px;}三行一列body{margin:0px;padding:0px;text-align:center;}#content-top{margin-left:auto;margin-right:auto;width:400px;width:370px;}#content-mid{margin-left:auto;margin-right:auto;width:400px;}#content-end{margin-left:auto;margin-right:auto;width:400px;}