江苏龙网

  1. 主页 > 生活百科 > >

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

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

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

文章插图


这个框架树立后，我们就可以在各个<div>内进行具体的开发了 。
可以发明，应用DIV元素，我们对页面进行布局时更便利 。
3、HTML5推举的布局计划应用DIV布局计划，应用起来特殊便利，根本上是前端开发者的首选 。不过在HTML5尺度来看，各个DIV的含义不明白，因此建议应用专门的元素来替代DIV 。这是依照HTML5推举的方法实现的布局计划页面：
<!DOCTYPE html><html>    <head>        <title>layout003</title>        <meta charset="utf-8" />        <style type="text/css">            html,body{                width:100%;                height:100%;            }            body,header,#second_row,nav,main,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%;            }            nav{                height:100%;                width:15%;                float:left;                color:white;                text-align:center;                background:blue;            }            main{                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>        <header>            题目区        </header>        <div id="second_row">            <nav>                导航区            </nav>            <main>                内容区            </main>        </div>        <footer>            状况栏区        </footer>    </body></html>


推荐阅读


上一篇：电脑键盘Esc的快捷功能 简单实用 电脑键盘ESC的快捷功能

下一篇：小米账户密码忘了怎么退出 修改小米账号的密码