|
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
- <title>特殊页面布局</title>
- <style>
- /*设置外层div的尺寸*/
- #nav{ width:980px; margin:0px auto;}
- /*设置类名为warp的样式,该样式为所有共用部分的样式*/
- .warp{ width:880px; margin:0px auto;}
- /*设置id为header的样式*/
- #header{ height:60px; background-color:pink;}
- /*设置id为childNav的样式*/
- #childNav{ width:100%; height:30px; background-color:red;}
- /*设置id为center的样式*/
- #center{height:800px; background-color:purple;}
- /*设置id为foot的样式*/
- #foot{ height:100px; background-color:blue;}
- </style>
- </head>
- <body>
- <div id="nav">
- <div id="header" class="warp">
- <div class="top"></div>
- </div>
- <div id="childNav">
- <div class="warp">
- <!--书写满屏div中的内容,如导航-->
- </div>
- </div>
- <div id="center" class="warp">
-
- </div>
- <div id="foot" class="warp">
-
- </div>
- </div>
- </body>
- </html>
复制代码
|
|