js教程html5新增的标签有哪些

<header>
    <p>这是一个header部分</p>
    <nav>    <!--导航链接标签-->
        <ul>    <!--配合ul使用-->
            <li>首页</li>
            <li>关于</li>
            <li>产品</li>
            <li>联系</li>
        </ul>
    </nav>
</header>

/*定义nav的高和颜色*/ 
nav{
    height:30px;
    background-color:#F33;
    margin-top:100px;}
/*正常设置li的样式*/
li{
    list-style:none;
    float:left;
    width:100px;
    height:30px;
}

<article><!--文章块p-->
　　<h2>文章标题</h2><!--标题-->
　　<p>文章内容文章内容文章内容文章内容文章内容文章内容
　　<br>
　　文章内容文章内容文章内容文章内容文章内容文章内容<br>
　　文章内容文章内容文章内容</p>
</article>　

article{
	background-color:#F33;
	width:500px;
	text-align:center;  /*水平居中*/  
	margin:0px auto;
}

<figure>
    <figcaption>标题</figcaption><!--配套-->
    <p>标题内容</p>
</figure>

<figure>
    <dt>标题1</dt>
    <dd>标题内容</dd>
</figure>

<dialog open>
          <dt>1问题</dt>
          <dd>1答案</dd>
          <dt>2问题</dt>
          <dd>2答案</dd>
</dialog>

<menu>
         <li>定义列表</li>
         <li>定义列表</li>
         <li>定义列表</li>
</menu>

<menu type="context" id="cai">
            <!--label是右键后显示的菜单项，onclick是选中菜单后执行的代码--> 
            <menuitem label="菜单一" onclick="alert('这是菜单一')" icon="右键单击显示的图片"></menuitem>
                   
</menu>

<span contextmenu="cai">单击我试试</span>

<hgroup><!--标题组-->
        <h3>标题</h3>
        <h3>标题1</h3>
        <h3>标题2</h3>
        <h3>标题3</h3>
</hgroup>

<small>法律条文</small>
<small>联系我们</small>
<small>客户意见</small>

<details>
        <dt>问题</dt>
        <dd>解答</dd>
        <dt>问题</dt>
        <dd>解答</dd>
        <dt>问题</dt>
        <dd>解答</dd>
</details>　　

<ruby>夼<rp>(</rp><rt>kuang</rt><rp>)</rp></ruby>
<!--<rp>是能够兼容的时候让括号不可见，不能兼容的时候让括号可见，rt是进行这是的内容-->

<meter min="0" max="10" value="4" low="2" high="7">

<meter min="0" max="10" value="8" low="2" high="7">

<progress id="jindu" max="100" value="0"></progress>进度条

<progress id="jindu" max="100" value="0"></progress>进度条
<script>
    var pro = document.getElementById("jindu");
    setInterval(function(){ pro.value+=1;},1000);    //间隔1秒它的值加1
</script>