近日查看了一些资料自己研究写了一个网站布局,采用高度自适应,css样式表如下: * { margin:0; padding:0; } body { font-size: 12px; font-family: verdana , arial , 细明体 , sans-serif; text-align: center; background-image: url(../images/bg.gif); } table { font-size: 12px; font-family: verdana, arial, 细明体, sans-serif; } /*空行*/ .space10{ height:10px; float:left; width:100%; } /*实现自适应高度的层*/ .autoaddheight{ font: 0px/0px sans-serif; clear: both; display: block; } /*顶部小菜单样式*/ #topdiv{ height:100px; width:930px; margin-left:auto; margin-right:auto; border:3px solid gray; } /*主菜单样式*/ #menudiv { float:inherit; width:930px; background:#e3ecf3; line-height:normal; margin-left:auto; margin-right:auto; font: bold 14px/1.5em verdana; height:40px; border:3px solid black; } #outer { margin-top: 0px; padding-left: 1px; margin-bottom: 0px; width: 95%; } #menudiv li{ /*子选择器,定义列表的样式*/ } /*网页左边框架样式*/ #leftcontent { float: left; width: 220px; text-align: left; border-right: #ccccff thin solid; border-top: #ccccff thin solid; border-left: #ccccff thin solid; border-bottom: #ccccff thin solid; } /*中部框架层*/ #center { width: 930px; float: none; clear: both; margin: auto; border-right: #330066 2px solid; border-top: #330066 2px solid; border-left: #330066 2px solid; border-bottom: #330066 2px solid; background-color: #ffffff; } /*右边主层*/ #rightbody { width: 702px; float: left; text-align: center; margin: 0px; border-right: #ccccff thin solid; border-top: #ccccff thin solid; border-left: #ccccff thin solid; border-bottom: #ccccff thin solid; } /*底部样式*/ #bottom{ width:930px; margin-left:auto; margin-right:auto; height:40px; border:3px solid gray; } .search { border-right: #ccccff thin solid; border-top: #ccccff thin solid; border-left: #ccccff thin solid; border-bottom: #ccccff thin solid; } .tree { background-color: #ffffff; } 网页代码如下: ttp://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd> http://www.w3.org/1999/xhtml >
无标题页
文件标题
系统设置关于