1、下面是我们应该知道的主要的语义标记符：
<header>定义网页片头后其他头部信息。通常王章所有网页的头部都是相同的
<footer>定义网页底部的文字，例如版权信息或联系方式等。通常，网站上的所有网页的底部应该具有相同的信息；
<arcticle>第一一篇文章、故事或者消息的一块文字，文章可以区别于其他文本，它们从逻辑上来说是独立的，例如，在一个新闻网站，每篇故事都是一篇文章
<aside >定义主题之外的文字，像注释、提示或者警告。aside有别于其他文本，他们可以从主要文件中抽取出来并删除，而不影响主要文档。
<section>定义普通的内容或应用区域，比如是书中章节或者一篇论文的各部分，网站首页可以分文几个区域，例如：介绍、新闻、联系方式等。区域以例如<h1>这样的标记符 开始后面跟着内容，如果要定义的区域包含文章或者网页的纲要，就是用<section>标记符，这是一种基本规则。
2、 创建区域：
我们可以使用id属性为一个区域命名，就像这样：<div id="masthead">,每个ID在一个文件中必须是唯一的，但是多个文件可以使用同样的区域名，这样的重复使用实际上 非常有好处，因为你可以定义一个样式表来定义多个文件的格式。
3、创建HTML5语义布局
可以根据文本的用途来选择合适标记符，从概念上讲，这和使用具有id属性的<div>标记符一样，但是标记符本身提供了文本含义。例如：你可以使用<header>标记符来代替
<div id="masthead">将相应的结束符改为</header>
4、区域定位
有两种方法可以给区域定位 悬浮样式规则(float style rule)或者使用定位样式规则。
例如，为了使导航栏悬浮在主题 文本的左边，你可以将导航栏区域设为特定的宽度（150像素），然后像下面这样将它悬浮于主题的左边：
<div id="topnav" style="width:150px;float:left">
在样式表中，需要在区域这样的唯一元素名字前面加一个井号#，就像下面这样：
#topnav{width:150px;float:left}
5、在网页中定位区域：
如果将一个区域放在网页中的特定位置，可以使用定位（position）格式规则，它有三个可选值：
Position：absolute 这个值定义了父元素的固定位置。父元素通常是<body>标记符，除非元素存在于其他标记符中，在这种情况下，该元素相对于网页上左上角的位置是固 定的
Position：relative 这个值定义了相对于元素自然位置的偏移值，即使新的位置造成了元素重叠，网页其他元素也不会受到影响。
Position：fixed 这个值定义了浏览器窗口中的固定位置，即使显示结果或者向下滚动，这个位置也不便变，微软的IE浏览器不支持这个设置。
例如：如果想将一个main区域准确定位在距离上面100像素，左边200像素的位置，可以创建下面的格式规则：
#main{position：absolute;top:100px;left:200px}
如果用<nav>标记符,可以向下面这样，
nav{position:absolute;top: 100px;width:150px}
定位样式规则在定位的时候考虑到网页中的其他元素，这样可能会造成元素重叠而影响网页的美观，不过也可以右移这样做来创建重叠元素，例如可以用这个功能将文本重叠在 图像上
6、