您的位置:首页 > Web前端 > HTML5

HTML5之主体元素结构

2017-08-31 09:09 399 查看
主体结构元素
主体结构元素,压实为了语义可以结构化,说白了就是为了更好的SEO,再直白一点就是为了浏览器更好的抓数据,包含的元素:article、section、nav、aside、time
(1)article 使用频率低
从语义上理解是文章、页面。通常的用法:一遍文章,一个页面和独立完整的内容。这个标签强调的是内容的独立性。同时,一般article元素里面会嵌套一个header
<article>
    <header>
        html5课程
    </header>
    <p>轻松学习htm5,欢迎来到<a
href="http://www.huadianedu.con"
>华点</a></p>
</article>
(2)section 频率低
章节,通常的用法:文章中的一段,这一段通常有标题和内容组成。
特点:强调分段分块
<article>
    <h1>苹果</h1>
    <p>是一种可以吃的水果,而且大家都喜欢吃,圆圆的</p>
    <section>
        <h3>红富士</h3>
        <p>是一种红色的苹果</p>
    </section>
    <section>
        <h3[/b]>国光</h3>
        <p>是一种青色的,酸酸的苹果</p>
    </section>
</article>
 
(3)nav(navigation)导航 使用频率高
通常用在导航栏
<header>
    <div
class="logo"
></div>
    <nav>
        <ul>
            <li>html</li>
            <li>css</li>
            <li>js</li>
        </ul>
    </nav>
</header>
(4)aside旁边,侧边
通常用法:放在article元素里面,作为附属信息部分,或者参考信息之类的。
放在article元素外面,作为整个页面的附属信息
<aside>
    <nav>
        <ul>
            <li>张三</li>
            <li>李四</li>
            <li>王二</li>
        </ul>
    </nav>
</aside>
(5)time 使用频率极低
时间标签,通常用法,表示24小时的某个时刻或者某个日期。
注意:该标签,所有浏览器都不支持。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息