作者:暗罗华怡 | 来源:互联网 | 2020-09-07 23:40
本篇文章主要的介绍了关于HTML5 section标签的定义以及它的用法,最后还有一个案例总结,现在让我们开始阅读这篇文章吧
先来解释下html5 section标签的意思:
html5 section标签定义了文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。
看一个实例让你更加了解section标签:
文档中的区段,解释了 PRC:
PHP中文网
这里是PHP中文网,网址是www.php1.cn
实例效果如下图:
现在说说section标签的注意点:
section 不是一个专用来做容器的标签,如果仅仅是用于设置样式或脚本处理,专用的是 div
section 里应该有 标题(h1~6),但文章中推荐用 article 来代替
一条简单的准则是,只有元素内容会被列在文档大纲中时,才适合用section元素。
section的作用是对页面上的内容进行分块,如各个有标题的版块、功能区或对文章进行分段,不要与有自己完整、独立内容的article混淆。
html5 section标签的用法:
html5引入了标签,用于描述文档的结构,它同标签的意思一样。但是在特定环境中,两者又有明显的区别。
w3对
w3对
的定义是: 定义一个文档的章节。(但似乎更适合用于外层的布局,缺少语义性。)
现在来看一个案例:
在这里,我们用来定义id为content的div里面的两个章节/区域。当然此处你也可以直接把div用section代替,或者把里面的改成,因为此处还不能明显的区分两者的区别:
或者:
HTML5 section标签的总结:
我们用
标签来布局整个最外层的章,而用
用来定义内部的章节。当然如果把整个文档都看作是一个章节,那么也可以用来代替,但是建议不要使用
来代替该用布局的地方,那些地方不能体现出
的语义性。【小编推荐】
如何给html中的pre标签中的文字换行?html pre标签的使用实例
HTML iframe标签怎么使用?HTML iframe标签的使用实例介绍
以上就是html5 section标签是什么意思?html5 section标签的用法总结的详细内容,更多请关注 第一PHP社区 其它相关文章!
推荐阅读
-
本文介绍了Java的集合及其实现类,包括数据结构、抽象类和具体实现类的关系,详细介绍了List接口及其实现类ArrayList的基本操作和特点。文章通过提供相关参考文档和链接,帮助读者更好地理解和使用Java的集合类。 ...
[详细]
蜡笔小新 2023-12-13 14:12:18
-
本文介绍了如何通过修改织梦DedeCms源代码来实现全站伪静态,以提高管理和SEO效果。全站伪静态可以避免重复URL的问题,同时通过使用mod_rewrite伪静态模块和.htaccess正则表达式,可以更好地适应搜索引擎的需求。文章还提到了一些相关的技术和工具,如Ubuntu、qt编程、tomcat端口、爬虫、php request根目录等。 ...
[详细]
蜡笔小新 2023-12-14 19:45:47
-
-
Monkey《大话移动——Android与iOS应用测试指南》的预购信息已经发布,可以在京东和当当网进行预购。感谢几位大牛给出的书评,并呼吁大家的支持。明天京东的链接也将发布。 ...
[详细]
蜡笔小新 2023-12-14 18:57:09
-
本文介绍了lua语言中闭包的特性及其在模式匹配、日期处理、编译和模块化等方面的应用。lua中的闭包是严格遵循词法定界的第一类值,函数可以作为变量自由传递,也可以作为参数传递给其他函数。这些特性使得lua语言具有极大的灵活性,为程序开发带来了便利。 ...
[详细]
蜡笔小新 2023-12-14 18:18:21
-
今天在看一个代码里头写了GetWindowLong(hwnd,0),我当时就有点费解,靠,上网搜索函数原型说明,死活找不到第 ...
[详细]
蜡笔小新 2023-12-14 17:58:15
-
本文介绍了在开发Android新闻App时,搭建本地服务器的步骤。通过使用XAMPP软件,可以一键式搭建起开发环境,包括Apache、MySQL、PHP、PERL。在本地服务器上新建数据库和表,并设置相应的属性。最后,给出了创建new表的SQL语句。这个教程适合初学者参考。 ...
[详细]
蜡笔小新 2023-12-14 17:15:19
-
本文介绍了基于layUI的图片上传前预览功能的两种实现方式:一种是使用blob+FileReader,另一种是使用layUI自带的参数。通过选择文件后点击文件名,在页面中间弹窗内预览图片。其中,layUI自带的参数实现了图片预览功能。该功能依赖于layUI的上传模块,并使用了blob和FileReader来读取本地文件并获取图像的base64编码。点击文件名时会执行See()函数。摘要长度为169字。 ...
[详细]
蜡笔小新 2023-12-14 17:06:58
-
本文介绍了使用Java实现大数乘法的分治算法,包括输入数据的处理、普通大数乘法的结果和Karatsuba大数乘法的结果。通过改变long类型可以适应不同范围的大数乘法计算。 ...
[详细]
蜡笔小新 2023-12-14 15:43:50
-
本文介绍了解决HDU 2372 El Dorado问题的一种动态规划方法,通过循环k的方式求解最长上升子序列的长度。具体实现过程包括初始化dp数组、读取数列、计算最长上升子序列长度等步骤。 ...
[详细]
蜡笔小新 2023-12-14 15:08:18
-
本文讨论了Alink回归预测的不完善问题,指出目前主要针对Python做案例,对其他语言支持不足。同时介绍了pom.xml文件的基本结构和使用方法,以及Maven的相关知识。最后,对Alink回归预测的未来发展提出了期待。 ...
[详细]
蜡笔小新 2023-12-14 14:25:33
-
本文讨论了如何优化解决hdu 1003 java题目的动态规划方法,通过分析加法规则和最大和的性质,提出了一种优化的思路。具体方法是,当从1加到n为负时,即sum(1,n)sum(n,s),可以继续加法计算。同时,还考虑了两种特殊情况:都是负数的情况和有0的情况。最后,通过使用Scanner类来获取输入数据。 ...
[详细]
蜡笔小新 2023-12-14 13:11:00
-
本文介绍了在Windows系统下配置PHP5.6的步骤及注意事项,包括下载PHP5.6、解压并配置IIS、添加模块映射、测试等。同时提供了一些常见问题的解决方法,如下载缺失的msvcr110.dll文件等。通过本文的指导,读者可以轻松地在Windows系统下配置PHP5.6,并解决一些常见的配置问题。 ...
[详细]
蜡笔小新 2023-12-14 12:37:25
-
本文介绍了在Docker容器技术中限制容器对CPU的使用的方法,包括使用-c参数设置容器的内存限额,以及通过设置工作线程数量来充分利用CPU资源。同时,还介绍了容器权重分配的情况,以及如何通过top命令查看容器在CPU资源紧张情况下的使用情况。 ...
[详细]
蜡笔小新 2023-12-12 18:31:07
-
本文探讨了Tomcat和Jetty选择扩展线程池而不是使用JDK原生线程池的原因。通过比较IO密集型任务和CPU密集型任务的特点,解释了为何Tomcat和Jetty需要扩展线程池来提高并发度和任务处理速度。同时,介绍了JDK原生线程池的工作流程。 ...
[详细]
蜡笔小新 2023-12-13 16:18:09
-
本文详细介绍了单点登录的原理及实现方案,其中包括共享Session的方式,以及基于Redis的Session共享方案。同时,还分享了作者在应用环境中所遇到的问题和经验,希望对读者有所帮助。 ...
[详细]
蜡笔小新 2023-12-12 19:23:28
-