资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

HTML5中有哪些常用的语义化标签

这篇文章给大家介绍HTML5中有哪些常用的语义化标签,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。

成都创新互联公司主要从事做网站、成都网站制作、网页设计、企业做网站、公司建网站等业务。立足成都服务巫山,十年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:028-86922220

nav 定义导航链接的部分

在页脚显示一个站点的导航链接,如首页、服务信息页面、版权信息页面等

article 定义文章

装载显示一个独立的文章内容,论坛帖子、新闻、博客文章、用户评论等,artilce可以嵌套,则内层的artilce对外层的article标签有隶属的关系。

    

标题

    

 内容

    
用户评论
    
回复评论

section 定义文档中的节

章节、页眉、页脚或文档中的其他部分,

   

标题1

   

内容1

   

标题2

   

内容2

aside 定义文章的侧栏

广告,成组的内容,友情链接,侧边栏等


header 定义文档的页眉

通常是一些引导和导航信息

       

logo

        

footer 定义文档或节的页脚

在典型情况下,该元素会包含创作者的姓名、文档的创作日期以及/或者联系信息

    

© 2019 All Rights Reserved. 

参考文献

1 html5 | http://caibaojian.com/html5
2 w3school | https://www.w3school.com.cn/
3 MDN | https://developer.mozilla.org/zh-CN/docs/Web/HTML/

下面是其它网友的补充

百度 IFE 任务一要求构建一个页面结构,看似简单,但需充分考虑到语义化。这篇文章简单谈谈 HTML5 语义化中的页面结构语义化的一些经验和理解。

1、为什么需要语义化

易修改、易维护。
无障碍阅读支持。
搜索引擎友好,利于 SEO。
面向未来的 HTML,浏览器在未来可能提供更丰富的支持。

2、结构语义化

语义元素均有一个共同特点——他们均不做任何事情。换句话说,语义元素仅仅是页面结构的规范化,并不会对内容有本质的影响。

下图展示了一个典型的页面结构。

HTML5中有哪些常用的语义化标签

头部

元素有两种用法,第一是标注内容的标题,第二是标注网页的页眉,如上图你看到的那样。除非必要(内容标题附带其它信息的情况下:发布时间、作者等),一般不在内容中使用
。因而,网页中可以包含多个
元素。按照 HTML5 的规定,
都应包含某个级别的标题,所以应隐式或显式地包含标题,通常将不希望显示的标题设置为display: none;,一方面遵守规范,另一方面则提供了无障碍阅读而不至于影响到页面设计。

导航栏

导航栏使用