语义化标签

为什么要语义化

• 代码结构：在没有css的情况下也能呈现出很好的内容
• 有利于SEO：可以和搜索引擎建立良好的沟通
• 便于团队开发和维护：语义化代码更具有可读性

h1~h6

定页面标题 h1元素具有最高等级

大标h1

     
标题h2
     
标题h3
     
标题h4
     
标题h5
     
标题h6

header

通常包括 logo ，主导航 ，全站链接 ，搜索框

    
标题
    

nav

定义页面导航链接部分区域

main

定义页面主要内容，一个页面只能用一次，web应用主要包括其重要功能

    
如果当时
    
红雨瓢泼泛起了回忆怎么潜

article

定义页面独立的内容，它可以有自己的header nav section

• 论坛文章
• 博客文章
• 新闻故事
• 评论

    
如果当时
    
红雨瓢泼泛起了回忆怎么潜

section

定义页面的某个区域

    
如果当时
    
红雨瓢泼泛起了回忆怎么潜

aside

用于显示与内容相关的内容块 通常显示侧边栏

footer

定义页面的底部

small

不重要的小字体内容

strong

定义语气较强的内容

blockquote

从常规文本中脱离出来 在元素前后加了换行 并增加外边距

abbr

解释缩写单词 title属性可提供全称

上号