HTML 5的革新——语义化标签section和article的区别
<section>标签
:
section,汉语意思为部分,这个标签定义网页上的每个单独部分,比如页眉,导航栏,页脚,或者其他的具有联系的部分。简单的来说任何具有逻辑的整体都可以放在section标签下,包括article标签。
<article>
标签:
article标签是section标签下一个独立的内容块。
article 元素适用场景:
- 讨论区
- 个人博客
- 新闻文章
- 评论区
这些标签都是语义化标签,他们的设计目的就是让网页逻辑更加得清晰,section标签类似于div标签,它包裹具有任何具有逻辑的部分(比如一篇文章),如有问题,欢迎评论。
获取更多信息请参考:
- http://www.w3schools.com/html/html5_semantic_elements.asp
- http://www.w3schools.com/tags/tag_article.asp
- http://www.w3schools.com/tags/tag_section.asp
HTML 5的革新——语义化标签section和article的区别的更多相关文章
- HTML 5的革新——语义化标签(一)HTML 5的革新——语义化标签(二)
HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...
- HTML 5的革新——语义化标签(一)
HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...
- HTML 5的革新——语义化标签
感谢原文作者:html5jscss 原文链接:http://www.html5jscss.com/html5-semantics-section.html 大佬的下一篇博文:http://www.ht ...
- HTML 5的革新——语义化标签(二)
HTML 5的革新之一:语义化标签二文本元素标签.分组元素标签. HTML 5的革新——语义化标签(一)中介绍了一些HTML5新加的一些节元素,一张页面中结构元素构成网页大体,但是也需要其他内容来填充 ...
- HTML 5的革新之一:语义化标签一节元素标签。
摘至于:<HTML 5的革新——语义化标签(一)> HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即 ...
- HTML5之语义化标签
HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...
- html5语义化标签总结二
HTML 5的革新之一:语义化标签二文本元素标签.分组元素标签. HTML 5的革新——语义化标签(一)中介绍了一些HTML5新加的一些节元素,一张页面中结构元素构成网页大体,但是也需要其他内容来填充 ...
- 笔记二:常用的h5语义化标签
0.前言: 所谓语义化标签就是一种 我们仅通过标签名就能判断出该标签内容的语义的标签,见名知意. 总结这部分内容,主要是为了能从繁琐的div嵌套div中,改成带有h5标签码.这样更有利于读写代码. 人 ...
- 第二季第十一天 html5语义化标签 css透明度
span不能设置宽高背景 HTML5语义化标签 <section>标签所包裹的是有一组相似的主题的内容,可以用这个标签来实现文章的章节.标签式对话框中的各种标签页等类似的功能. <s ...
随机推荐
- 「雕爷学编程」Arduino动手做(37)——MQ-3酒精传感器
37款传感器与模块的提法,在网络上广泛流传,其实Arduino能够兼容的传感器模块肯定是不止37种的.鉴于本人手头积累了一些传感器和模块,依照实践出真知(一定要动手做)的理念,以学习和交流为目的,这里 ...
- Redux:data flow
我们使用react,是为了构建可复用的高性能的视图层,学习redux是为了处理视图组件中随应用复杂度提升而变得难以控制的state.说白了,是为了视图. 在了解了action.reducer和stor ...
- Django视图函数之FBV与CBV模式
FBV模式: FBV(function base views) 就是在视图里使用函数处理请求. 一般直接用函数写的都属于是FBV模式. veiws.py from django.shortcuts i ...
- DPDK Timer Library原理(学习笔记)
0 前置知识学习跳表(SkipList) 跳表应具有以下特征: 1)一个跳表应该有多个层(level)组成,通常是10-20层. 2)跳表的第0层包含所有的元素. 3)每一层都是一个有序的链表.层数越 ...
- elementUI中el-input输入数字且保留指定小数位
<input type="text" placeholder="请输入保留一位小数的数字" class="user-input user-nam ...
- [JavaWeb基础] 029.OGNL表达式介绍
1.OGNL概述 OGNL,全称为Object-Graph Navigation Language,它是一个功能强大的表达式语言,用来获取和设置Java对象的属性,它旨在提供一个更高的更抽象的层次来对 ...
- [SD心灵鸡汤]000.每月一则 - 索引
[SD心灵鸡汤]001.每月一则 - 2015.05 [SD心灵鸡汤]002.每月一则 - 2015.06 [SD心灵鸡汤]003.每月一则 - 2015.07 [SD心灵鸡汤]004.每月一则 - ...
- BUUCTF WEB-WP(3)
BUUCTF WEB 几道web做题的记录 [ACTF2020 新生赛]Exec 知识点:exec命令执行 这题最早是在一个叫中学生CTF平台上看到的类似,比这题稍微要复杂一些,多了一些限制(看看大佬 ...
- Java中的集合(十二) 实现Map接口的WeakHashMap
Java中的集合(十二) 实现Map接口的WeakHashMap 一.WeakHashMap简介 WeakHashMap和HashMap一样,WeakHashMap也是一个哈希表,存储的也是键值对(k ...
- Pytorch分类和准确性评估--基于FashionMNIST数据集
最近在学习Pytorch v1.3最新版和Tensorflow2.0. 我学习Pytorch的主要途径:莫烦Python和Pytorch 1.3官方文档 ,Pytorch v1.3跟之前的Pytorc ...