如何进行HTML页面的布局 怎样合并html中的单元格( 二 )

应用阅读器打开这个HTML文档,展现后果如下:

如何进行HTML页面的布局 怎样合并html中的单元格

文章插图


这个框架树立后,我们就可以在各个<td>内进行具体的开发了 。
2、DIV布局计划应用DIV布局计划时,全部阅读器的展现部分由各个DIV来分配 。下面是应用DIV布局计划的HTML页面:
<!DOCTYPE html><html>    <head>        <title>layout002</title>        <meta charset="utf-8" />        <style type="text/css">       &n资源网bsp;    html,body{                width:100%;                height:100%;            }            body,#header,#second_row,#navigator,#content,#footer{                margin-left: 0px;                margin-top: 0px;                margin-right: 0px;                margin-bottom: 0px;            }            #header{                height:6%;                width:100%;                color:white;                text-align:center;                background:green;            }            #second_row{                height:91%;                width:100%;            }            #navigator{                height:100%;                width:15%;                float:left;                color:white;                text-align:center;                background:blue;            }            #content{                height:100%;                width:85%;                float:right;                color:white;                text-align:center;                background:gray;            }            #footer{                height:3%;                width:100%;                color:white;                text-align:center;                background:orange;            }        </style>    </head>    <body>        <div id="header">            题目区        </div>        <div id="second_row">            <div id="navigator">                导航区            </div>            <div id="content">                内容区            </div>        </div>        <div id="footer">            状况栏区        </div>    </body></html>


推荐阅读