HTML5中section标签与content标签的区别

最新推荐文章于 2024-08-24 20:54:28 发布
最新推荐文章于 2024-08-24 20:54:28 发布
阅读量7.8k 收藏 2
点赞数
分类专栏： HTML+CSS专场 文章标签： HTML5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wy6250000/article/details/83748645
版权

开发中不经意发现section和content标签的明显区别，在看书时并没有对此做解释，这里补充说明。

分别用section标签和content标签包一段文字，设置边框样式border:1px solid #bbb，得到如下效果。

section标签
在这里插入图片描述

content标签
在这里插入图片描述
很明显可以看到content标签是按行渲染文本；section更像一个div，包裹内容的容器

Joy__Yue
关注
专栏目录
html5中content属性,详解css中的content属性的用法
weixin_39995764的博客
06-04 3377
content属性一般用于::before、::after伪元素中，用于呈现伪元素的内容。用法详解1、插入纯字符*{margin: 0;padding: 0;box-sizing: border-box;}li{list-style: none;}.content{position: relative;padding: 10px;border: 1px solid #666;margin: 10p...
html5布局content标签,HTML5新标签元素Header与Footer，方便seo抓取
weixin_39832643的博客
06-17 557
HTML5新标签的优点：1.更注重于内容而不是形式2.对人的友好，更加的语义化，高度的毛属性，更加的只管，添加了代码的可读性3.对计算机的友好，游览器更容易解析，搜索引擎更容易抓取文档的内容4。代码更加的简洁新添加的布局标签1.article标签，定义一个独立内容区块，一片文章，一个视频文件等2.cection标签，定义一个区域，如文章的章节等3.nav标签 定义目录导航4.aside标签：定义侧...
H5新增标签
weixin_45239190的博客
09-15 535
1.H5 新增标签 语义化标签：header表达了头部的意思，在网页中任意暗含头部的结构都可以使用header标签 功能性标签： 2.h5新增表单属性 email：必须输入邮件； url：必须输入url地址； number：必须输入数值； range：一个滑动栏，并且可以设置最大以及最小值 date：选取日、月、年 month：选取月、年 week：选取周和年 time：选取时间（小时和分钟） datetime-local：选取时间、日、月、年（本地时...
【HTML知识】——-HTML5介绍(一)
最新发布
2401_86134243的博客
08-24 850
HTML5的介绍 Web 技术发展时间线 1991 HTML 1994 HTML2 1996 CSS1 + JavaScript 1997 HTML4 1998 CSS2 2000 XHTML1（严格的html） 2002 Tableless Web Design（表格布局） 2005 AJAX 2009 HTML5 2014 HTML5 Finalized 2002年的表格布局逐渐被淘汰，是因为：表格是用来承载数据的，并不是用来划分网页结构的。 2009年就已经
HTML 的四大内容标签
weixin_51182359的博客
04-21 2404
HTML内容的四大标签
CSS Content 属性的几种妙用和技巧
设计师工作日常
01-26 3973
你知道 CSS Content 属性能有哪些创意技巧和妙用吗？
HTML5标签与HTML4标签的区别示例介绍
09-28
总之，HTML5与HTML4在标签和语法上的区别，不仅体现在语义化和结构化上的增强，还包括了对表现层的简化和对于新技术的适应。HTML5的这些变化，让网页开发更加高效和标准化，同时为开发者提供了更多的语义选择，使得...
HTML5之语义标签介绍
01-19
在HTML5标准中，新加了几个用于增添页面语义的标签，这些标签有：article、section、nav和aside等。与别的大多数标签不 同，浏览器在解释渲染这些标签的时候仅仅把它作为普通的div块级元素来处理，不会添加任何额外...
HTML5 对各个标签的定义与规定：section
11-21
### HTML5中的<section>标签详解 #### 一、引言 在HTML5中，为了更好地组织和呈现网页内容，引入了一系列新的语义化标签，其中`<section>`标签是一个非常重要的组成部分。它不仅有助于提高网页的可读性和可维护性...
HTML5标签嵌套规则详解【必看】
09-28
HTML5标签嵌套规则是构建网页结构的重要组成部分，它规定了不同类型的HTML元素如何相互包含。在HTML5中，元素的分类方式发生了变化，不再基于display属性，而是根据内容模型来划分，使得网页结构更加清晰，有利于...
HTML5标签小集
12-13
这只是HTML5中一部分标签的概述，实际上还有许多其他标签，如`<header>`、`<footer>`、`<nav>`、`<section>`等，它们增强了网页的结构化和语义化，使得网页内容更易于理解，搜索引擎优化，以及无障碍访问。...
asp:Content的用法
PANDS
06-15 1465
<br />看页面觉得很奇怪，怎么在源代码里看不到链接，效果上却有链接，于是猜想是不是有类似jsp里面的include之类的方法，比如说当初我用的用户自定义控件usercontrol之类的，结果没发现，却发现多了个<asp:content>然后没有了<head><body>之类的。上网查了下，结果这是MasterPage技术，百度知道的介绍如下： <br />           MasterPage其实是一种模板，它可以让你快速的建立相同页面布局而内部不同的网页，如果一个网站有多个MasterPage，那
CSS中content的使用
qq_54334713的博客
04-14 1393
目录 content属性 语法格式： 使用前提： 效果实现： 实例： content属性 语法格式： content: normal|none|counter|attr|string|open-quote|close-quote|no-open-quote|no-close-quote|url|initial|inherit; 使用前提： 多与：after 和：before配合使用 效果实现： 显示具体内容 通过attr（）显示标签的属性 显示字符集图标 图片替换文字
HTML5知识全解
qq_54334713的博客
03-23 2267
HTML5 HTML5语法 HTML5的标签 HTML5标签属性 HTML5 文档注释 HTML5的文档结构 HTML5 的基本格式 基本格式解读 HTML5 常见的块级标签和行级标签 常见的块级标签 常见的行级标签 特点与区别 新增标签 HTML5表格 表格的定义 表格的基本属性 表格的结构化与直列化 HTML5表单 表单结构 表单的常用属性 textarea 文本域 HTML5智能表单 HTML5 HTML5语法 HTML5的标签 标签是HTM...
html中content属性,CSS3的content属性详解
weixin_33673142的博客
06-05 9233
CSS中主要的伪元素有四个：before/after/first-letter/first-line，在before/after伪元素选择器中，有一个content属性，能够实现页面中的内容插入。插入纯文字content:"插入的文章"，或者content:none不插入内容html:这是h1这是h2cssh1::after{content:"h1后插入内容"}h2::after{content:...
你所不知道的html5与html中的那些事（三）
lonely_online的专栏
04-12 528
文章简介： 关于html5相信大家早已经耳熟能详，但是他真正的意义在具体的开发中会有什么作用呢？相对于html，他又有怎样的新的定义与新理念在里面呢？为什么一些专家认为html5完全完成后，所有的工作都可以达到真正的云方式呢？这一系列的问题你是否已经想明白了呢？ 本系列文章将为您一一解答你所不知道的关于html5与html中的那些事;具体会包括如：html5新的理念与想法，html5的
HTML5新增的标签和属性归纳
热门推荐
YangJack-前端开发
01-27 3万+
收集总结的HTML5的新特性，基本除了IE9以下都可以使用。 HTML5语法 大部分延续了html的语法 不同之处：开头的 字符编码变得简洁， 不区分大小写， 添加了布尔值，类似checked，selected 引号可以省略，但是编码规范来说，不建议， 有可以省略结束符的标签，和完全省略的标签应用。 增加标签： 1、结构
css中content的使用
haoyanyu_的博客
05-08 1万+
1.显示具体内容（跟：after 和：before配合使用） HTML：  CSS  :   效果如下： 2.通过attr（）显示标签的属性 HTML：  CSS:  效果如下：  3.显示字符集图标 更多字符可以访问https://blog.csdn.net/sinat_17775997/article/details/52384680 4.图片替换文字 HTML...
HTML5标签使用误区解析
作者指出，HTML5虽然还处在草案阶段，但其标签的使用已经存在一些误解，如误将<section>标签当作通用的容器标签使用，而忽视了其语义化的含义。" 在HTML5中，新增的标签是为了增强网页的语义性，帮助开发者更好地...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值