HTML5大纲算法（HTML5 Outliner）

2019独角兽企业重金招聘Python工程师标准>>>

HTML5大纲算法（HTML5 Outliner）

1、HTML5大纲算法

合理的使用HTML5元素标签，可以生成一个条例非常清晰的网站文档大纲。

测试网站地址：https://gsnedders.html5.org/outliner/

<section></section>，<nav></nav>标签结构上必须包含至少一个h1---h6。

<div></div>

<section></section>标签最好的使用结构

<section>
    <h1>...</h1>
    <p>...</p>
</section>

2、HTML5合理结构

<header id="header">
    <div class="center">
        <h1 class="logo">标题Logo</h1> /*h1最好只出现一次，利于SEO优化*/
        <nav class="link">
            <h2 class="none">网站导航</h2> /*.none{display:none;} 目的是为了满足大纲算法*/
        <ul>
            <li class="active"><a href="###">首页</a></li>
            <li><a href="###">1</a></li>
            <li><a href="###">2</a></li>
            <li><a href="###">3</a></li>
            <li><a href="###">4</a></li>
        </ul>
    </nav>
</div>
</header>

3、需要包含标题的标签

需要包含标的标签：nav、section

不需要标题的标签：div、header、footer

4、浏览器滑动条下拉框宽度是：17px

转载于:https://my.oschina.net/owengao/blog/484028