html 5新增技术,HTML5新增的几个容器模块

H5新增的几个容器块元素：

1、header:用户表示页面或某个区域的头部

2、nav:用于表示导航栏

3、aside:用于表示跟周围主题相关的附加信息

4、article:用于表示一个整体的一部分主题

5、section:表示右边的侧边栏

6、footer:用于表示页面或某个区域的脚注

Document

* {

margin: 0;

padding: 0;

}

.box {

width: 80%;

text-align: center;

font-size: 30px;

margin: 10px auto;

}

header {

width: 100%;

height: 100px;

outline: 1px solid red;

line-height: 100px;

}

.box1 {

width: 100%;

position: relative;

height: 550px;

}

nav {

width: 70%;

height: 50px;

outline: 1px solid black;

position: absolute;

left: 0px;

top: 0px;

line-height: 50px;

}

aside {

width: 30%;

height: 50px;

outline: 1px solid blue;

position: absolute;

right: 0px;

top: 0px;

line-height: 50px;

}

article {

width: 70%;

height: 500px;

outline: 1px pink solid;

position: absolute;

left: 0px;

top: 50px;

line-height: 500px;

}

section {

width: 30%;

height: 500px;

outline: 1px yellow solid;

position: absolute;

right: 0px;

top: 50px;

line-height: 500px;

}

footer {

width: 100%;

height: 100px;

outline: 1px solid rebeccapurple;

line-height: 100px;

}

我是网页的头部

我是左边的导航栏

我是右边的导航栏

我是主体内容

我是右边的侧边栏

我是底部