资源描述：
《最简单的css+div布局.doc》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。
1、楼主 发表于:2009-08-0120:38只看楼主
2、小中大0一个简单的css+div布局实例，让你很明了的了解怎么布局！分析它的结构，有以下几个部分：黑色的头部，蓝色的主体，拆分成红色的变蓝，和右边的导航及主体部分，最下面的黄色是底部，结构相当简单，现在开始写它的css了，定义最上面的黑色为header：复制代码1.#header{margin:0px;clear:both;background:black;width:800px;height:100px;text-align:center;padding-top:12px;}然后中间的蓝
3、色主体叫mainbox吧，那么样式表可以写：复制代码1.#mainbox{margin:auto0px;width:800;background:blue;height:410px;}以此定义其他如下：复制代码1.#sidebar{margin:12px2px5px12px;float:left;background:red;width:200px;height:400px;clear:right;} /*******上右下左*******/ 2.#menu{margin:12px2px5px12px;float:right;back
4、ground:red;width:550px;height:30px;}3.#content{float:right;margin:4px2px2px;12px;width:550px;height:361;background:#000;padding-left:0px;}4.#footer{margin-rop:0px;width:800px;height:40px;background:#fff000;}说明：margin右边的四个值分别对应上右下左，比如menu距下是5px，content距上是4px，所以中间有9px的间距了，而先定
5、义了menu的高位30px，所以content若想和sidebar对齐，则应该定义高度为400-30-4-5=361.上面完成了
