《提供一则DIVCSS的网页布局代码.doc》由会员分享，可在线阅读，更多相关《提供一则DIVCSS的网页布局代码.doc（3页珍藏版）》请在金锄头文库上搜索。
1、单行一列以下是引用片段：body margin: 0px; padding: 0px; text-align: center; #content margin-left:auto; margin-right:auto; width: 400px; width: 370px; 两行一列以下是引用片段：body margin: 0px; padding: 0px; text-align: center;#content-top margin-left:auto; margin-right:auto; width: 400px; width: 370px;#content-end margin-le
2、ft:auto; margin-right:auto; width: 400px; width: 370px;三行一列以下是引用片段：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; width: 370px; #content-end margin-left:
3、auto; margin-right:auto; width: 400px; width: 370px; 单行两列以下是引用片段：#bodycenter width: 700px;margin-right: auto; margin-left: auto;overflow: auto; #bodycenter #dv1 float: left;width: 280px;#bodycenter #dv2 float: right;width: 410px;两行两列以下是引用片段：#header width: 700px; margin-right: auto;margin-left: auto;
4、 overflow: auto;#bodycenter width: 700px; margin-right: auto; margin-left: auto; overflow: auto; #bodycenter #dv1 float: left; width: 280px;#bodycenter #dv2 float: right;width: 410px;三行两列以下是引用片段：#header width: 700px;margin-right: auto; margin-left: auto; #bodycenter width: 700px; margin-right: auto;
5、 margin-left: auto; #bodycenter #dv1 float: left;width: 280px;#bodycenter #dv2 float: right; width: 410px;#footer width: 700px; margin-right: auto; margin-left: auto; overflow: auto; 单行三列绝对定位以下是引用片段：#left position: absolute; top: 0px; left: 0px; width: 120px; #middle margin: 20px 190px 20px 190px; #
6、right position: absolute;top: 0px; right: 0px; width: 120px;float定位一xhtml:以下是引用片段：这里是第一列这里是第二列这里是第三列CSS:以下是引用片段：#wrap width:100%; height:auto;#column float:left; width:60%;#column1 float:left; width:30%;#column2 float:right; width:30%;#column3 float:right; width:40%;.clear clear:both;float定位二xhtml:以
7、下是引用片段：This is the main content.This is the left sidebar.This is the right sidebar.CSS:以下是引用片段：body margin: 0;padding-left: 200px;padding-right: 190px;min-width: 240px;.column position: relative;float: left;#center width: 100%;#left width: 180px; right: 240px;margin-left: -100%;#right width: 130px;m
8、argin-right: -100%;两行三列xhtml:以下是引用片段：这里是顶行这里是第一列这里是第二列这里是第三列CSS:以下是引用片段：#headerwidth:100%; height:auto;#wrap width:100%; height:auto;#column float:left; width:60%;#column1 float:left; width:30%;#column2 float:right; width:30%;#column3 float:right; width:40%;.clear clear:both;三行三列xhtml:以下是引用片段：这里是顶行这
9、里是第一列这里是第二列这里是第三列这里是底部一行CSS:以下是引用片段：#headerwidth:100%; height:auto;#wrap width:100%; height:auto;#column float:left; width:60%;#column1 float:left; width:30%;#column2 float:right; width:30%;#column3 float:right; width:40%;.clear clear:both;#footerwidth:100%; height:auto;PS:这里列出的是常用的例子，而非研究之用，对一每个盒子，都没有设置margin,padding,boeder等属性！
