html div 知识点,HTML知识点总结之div、section标签

div元素

div是块级元素,相当于一个容器,在语义上不代表任何特定类型的内容。主要用作大的框架布局,也就是说网页的骨架主要通过div来架设的,而网页的血肉则是有span、p或者ul等元素完成。

section元素

标签是HTML5新增的语义化标签,代表文档中的“节”或“段”。“段”可以是指一篇文章里按照主题的分段;“节”可以是指一个页面里的分组。主要作用为对页面的内容进行分块或者对文章的内容进行分段。

section是块级元素,section标签通常带有一个标题和一个内容块。​

article元素​

标签也是HTML5新增的语义化标签,代表一个页面中自成一体的内容,目的是为了让开发者独立开发或重用。譬如论坛的帖子,博客上的文章,一篇用户的评论等。除了内容,article会有一个标题(通常会在header里)和一个footer页脚。article也是块级元素

如果在article内部再嵌套article,代表内嵌的article与它外部的内容有关联。

section与article的区别:

section和article可以互相嵌套,也就是说他们没有上下级关系,section可以包含article,article也可以包含section。

拿报纸举个例子:

一份或一张报纸有很多个版块,有头版、国际时事版块、体育版块、娱乐版块、文学版块等等,像这种有版块标题的、内容属于一类的版块就可以用section包起来。

然后在各个版块下面,又有很多文章、报道,每篇文章都有自己的文章标题、文章内容。这个时候用article就最好。如果一篇报道太长,分好多段,每段都有自己的小标题,这时候又可以用section把段落包起来。(以上内容来自知乎https://www.zhihu.com/question/20227599 )

section和div的区别

1、section和div都可以对内容进行分块,但是section是进行有意义的分块,无意义的分块应该由div来做,例如用作设置样式的页面容器。

2、section内部必须有标题,标题也代表了section的意义所在。

注意:

​1、不要将作为用来设置样式或行为的“钩子”容器,那是

的工作。

2、如果、或更符合状况,不要使用。

3、不要为没有标题的内容区块使用。

4、一条简单的准则是,只有元素内容会被列在文档大纲中时,才适合用section元素。

内容来源于网络如有侵权请私信删除

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/485499.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

我们的大脑,足以理解大脑本身吗?

来源: 利维坦树突(红色)神经元的分支过程,接收突触信息的突出棘的渲染,以及来自小鼠大脑皮层的饱和重建(多色圆柱体)。© Lichtman Lab at Harvard University利维坦按:关于大脑…

Leetcode--17.电话号码的字母组合

给定一个仅包含数字 2-9 的字符串,返回所有它能表示的字母组合。 给出数字到字母的映射如下(与电话按键相同)。注意 1 不对应任何字母。 示例: 输入:"23" 输出:["ad", "ae", "af…

博弈论模型总结

博弈论五大模型 前四大模型的深入理解 Bash博弈模型 有一堆数量为n的石头,双方轮流每次从堆中取至少1个石头最多m个石头,谁先取完谁赢。 设存在整数k和r使方程**nk*(m1)r**成立,当r0时先手必败,否则先手必赢。 结论:n%(m1) 0, 先…

安全技术可以采用计算机安全,2017年计算机三级《信息安全技术》习题

2017年计算机三级《信息安全技术》习题信息安全技术主要培养熟练掌握网络设备的安装、管理和维护,能分析企业网络和信息系统安全漏洞、及时解决网络安全问题,并能够根据企事业单位业务特点设计制作安全的电子商务/政务网站的专业人员。以下是小编整理的2…

福布斯:14位技术专家预测,未来哪些行业将被AI颠覆?

来源:Forbes转自:新智元未来,哪些行业将从人工智能中受益?14位技术专家对哪些行业和部门最终将从AI中受益最大进行了预测。哪些行业将受益于AI?目前,人工智能和机器学习已进入许多不同的行业,改…

P3195 [HNOI2008]玩具装箱TOY

P3195 [HNOI2008]玩具装箱TOY 题目描述 P教授要去看奥运,但是他舍不下他的玩具,于是他决定把所有的玩具运到北京。他使用自己的压缩器进行压缩,其可以将任意物品变成一堆,再放到一种特殊的一维容器中。P教授有编号为1...N的N件玩具…

Leetcode--671. 合并二叉树

给定两个二叉树,想象当你将它们中的一个覆盖到另一个上时,两个二叉树的一些节点便会重叠。 你需要将他们合并为一个新的二叉树。合并的规则是如果两个节点重叠,那么将他们的值相加作为节点合并后的新值,否则不为 NULL 的节点将直…

吕述望 计算机网络专家,特稿: 中科院吕述望教授:互联网名不符实

国际中华智慧学会创新智慧研究通讯编号:YT-2012-007发布日期:2012年8月28日吕述望教授认为中国互联网名不符实中国香港讯:月前,中国工信部部长隆重宣布,将加快面向全新框架未来互联网的技术研发前沿布局,力…

打开AI芯片的“万能钥匙”

来源:雷锋网 作者:包永刚雷锋网按,新推出的AI芯片因架构的独特性和软件的易用性增加了客户尝试和迁移的成本,因此,软件成为了能否快速、低成本迁移的关键。现在普遍的做法是在TensorFlow写一些后端集成新硬件&#xff…

python2.7 threading RLock/Condition文档翻译 (RLock/Condition详解)

RLock Objects 可重入锁是一个同步原语,它可以被同一个线程多次获取。在内部,除了原始锁使用的锁定/解锁状态之外,它还使用“线程拥有”和“递归级别”的概念。在锁定状态下,某些线程拥有锁;在未锁定状态下&#xff0c…

Leetcode--33. 搜索旋转排序数组

假设按照升序排序的数组在预先未知的某个点上进行了旋转。 ( 例如,数组 [0,1,2,4,5,6,7] 可能变为 [4,5,6,7,0,1,2] )。 搜索一个给定的目标值,如果数组中存在这个目标值,则返回它的索引,否则返回 -1 。 你可以假设数组中不存在…

北理计算机教案,北理工版三年级信息技术教案重点.docx

第1单元 初识神奇计算机第1课 神奇电子计算机【教学目的和要求】1、学生了解计算机组成各部分的名称和作用。2、学生知道什么是计算机软件,了解计算机软件的作用。3、学生了解计算机处理信息的过程。4、学会正确启动与关闭计算机。【教学重点】教学难点:…

Leetcode--162. 寻找峰值

峰值元素是指其值大于左右相邻值的元素。 给定一个输入数组 nums,其中 nums[i] ≠ nums[i1],找到峰值元素并返回其索引。 数组可能包含多个峰值,在这种情况下,返回任何一个峰值所在位置即可。 你可以假设 nums[-1] nums[n] -…

计算机发展历程按什么划分,计算机的发展阶段是按什么划分的

大家好,我是时间财富网智能客服时间君,上述问题将由我为大家进行解答。计算机的发展阶段是按电子元件划分的,具体阶段如下:1、第1代为电子管数字机( 1946到1958年)。硬件方面,逻辑元件采用的是真空电子管,主存储器采用汞延迟线、阴…

因果推理、正则化上榜:权威专家盘点过去50年最重要的统计学思想

来源:机器学习研究组订阅在日常生活中,统计学无处不在,每个人、每件事似乎都可以使用统计数据加以说明。随着人类迈入大数据时代,统计学在方方面面更是发挥了不可或缺的作用。统计学思想,就是在统计实际工作、统计学理…

Nginx正向与反向代理

Nginx 主要用于反向代理与负载均衡 什么是代理服务器(Proxy Serve)? 提供代理服务的电脑系统或其它类型的网络终端,代替网络用户去取得网络信息。 为什么使用代理服务器? 提高访问速度 由于目标主机返回的数据会存放在代理服务…

计算机组成原理延迟时间ty,计算机组成原理第6章_5运算方法.ppt

文档介绍:6.5 算术逻辑单元一、ALU 电路四位 ALU 74181M 0 算术运算M 1 逻辑运算S3 ~ S0 不同取值,可做不同运算ALUAiBiFi…SiM位片式运算器4位双极型位片式运算器AM2901,它将ALU、通用寄存器组、多路开关、移位器等逻辑构件集成在一个芯片内。通用寄存器寄存器写…

Leetcode--172. 阶乘后的零

给定一个整数 n,返回 n! 结果尾数中零的数量。 示例 1: 输入: 3 输出: 0 解释: 3! 6, 尾数中没有零。 示例 2: 输入: 5 输出: 1 解释: 5! 120, 尾数中有 1 个零. 说明: 你算法的时间复杂度应为 O(log n) 。 思路: 能出现零的因子里面一定出现2&am…

生命起源的奥秘:分子生物学对生命起源研究

来源: 科学技术哲学1993年加州大学柏克利分校的詹腓力教授邀请了一批科学家、哲学家到加州中部的一个海滨小镇相聚。这些学者来自著名的学术中心,包括剑桥、慕尼黑、芝加哥大学等学府,他们是来质疑一个统治了科学界长达150年的学说。保罗.尼尔…

Python学习第二天

运算符类型: 1.算术运算符 a 10*10 2.赋值运算 a a 1 3.比较运算 a 1 > 5 4.逻辑运算 a 1>6 or 11 5.成员运算 a "文" in "郑建文" 基本数据类型 数字  int 字符串  str 列表  list 元祖  tuple 字典  dict 布尔值  b…