P标签里面为什么不能添加div标签

已于 2023-04-18 10:05:18 修改
阅读量3.5k 收藏 1
点赞数 1
分类专栏： html HTML5 web前端 文章标签： html 前端 javascript
于 2018-05-18 18:35:51 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/CodingNoob/article/details/80368218
版权
web前端 同时被 3 个专栏收录
99 篇文章 2 订阅
订阅专栏
HTML5
27 篇文章 0 订阅
订阅专栏
html
10 篇文章 0 订阅
订阅专栏

很多刚接触html的同学可能比较少注意到这个问题，html标签里面是不是可以随便放标签，答案是肯定不行的。

为什么呢？ 我们先看一张图代码图

这里写图片描述

然后浏览器渲染出来的DOM是这样的
这里写图片描述

本人使用的浏览器是chrome
这里写图片描述

看到区别了么，命名我们已经将p标签包裹在div外面了，为什么他们跑出来了呢？

HTML写一个div就可以布局玩所有页面，但是为什么要有那么标签，那是因为每个标签都有每个标签所代表的含义，都有他应该应用的场景，这就是所谓的标签语义化，和W3C标准代码规范

虽然可以随便乱写浏览器并不会报错，那是因为浏览器本身会尽可能的去解释html代码，但是浏览器也有他自己的渲染规则，所以渲染的时候有可能得不到想要的结果。

在一些span,a、em 、strong 等行级元素里面，不要添加div 、p 、dd等块级元素

#麻辣小龙虾#
关注
专栏目录
p 标签里面不能嵌套 div 标签
He Manyuan
12-16 2788
p 标签里面不能嵌套 div 标签 开头先放大加粗的展示这句话 作为一名半专业的切图仔，怎么能够犯如此低级的错误？？ 某日… 正常搬砖中，突遇一奇葩问题，尝试各种方案均试无法解决 大致情况如下(JSX)： ... <p className={styles.item1}> <span>Item1</span> <Component1 /> &...
在html中p标记可以嵌套p标记,html P标签为什么不能嵌套div？还有关于html P标签的css样式的实例介绍...
weixin_28795851的博客
06-10 1758
本篇文章介绍了有关于html p标签的进阶版，上一篇基础版没看过的同学点击下方的链接就可以看了，本篇主要介绍了html p标签的两个重要知识点，一个是如何用css的样式来控制P标签的具体使用，每个都有实例，有兴趣的同学可以自己敲代码试试，还有一个是html P标签为什么不能嵌套div的详解，希望各位认真阅读html P标签标签定义及使用说明： 标签定义段落。元素会自动在其前后创建一些空白。浏览器会...
HTML中为何P标签内不可包含DIV标签？
u014686861的专栏
05-06 5167
起因：在做项目时发现原本在DW中无误的代码到了MyEclipse6.0里面却提示N多错误，甚是诧异。于是究其原因，发现块级元素P内是不能嵌套DIV的。 深究：我们先来认识in-line内联元素和block-line块元素，因为HTML里几乎所有元素都属于内联元素或者块元素中的一种。 in-line这个词有很多种解释：内嵌、内联、行内、线级等，但是，它们都是表示相同的意思，在这里我们选择
p标签为什么不能嵌套div标签？如果嵌套会发生什么呢？
阿珂学cv
10-23 1228
当我们学html时，老师就告诉我们p标签不能嵌套div标签，但是为什么呢？今天我亲测了下原因，帖图来证！
HTML的基础标签
最新发布
qq_64131047的博客
06-26 794
百度⼀下使用方法：div50本页面 此时这个div50的id值就是50，通过#50进行锚点指向。eg:需要展现给⽤户查看的内容
p标签中可以嵌套div嘛
qq_42931285的博客
03-23 486
p标签中可以嵌套div嘛
＜p＞ 里可以写 ＜div＞ 吗? 你可能真的不知道
broken_promise的博客
06-13 1447
在学习 计数器 函数时, 我尝试使用 和 互相嵌套组成 结构. 如下 页面显示元素都正常, 但是计数器就是不正常😡, 于是我检查元素发现整个页面的 结构被浏览器悄悄地改了. 浏览器为什么要这么做呢?🤨 规范中的每一个元素都有一个内容模型: DOM. 规范中明确了 元素的内容必须匹配这个元素的 . 的 是 phrasing content 的 是 flow content因此, 不能包含 (反过来可以), 不仅仅是 , 任何非 的元素都不行, 包括 , 等, 甚至包含自身, 因为 ..
百度编辑器 ueditor 内容编辑自动套P标签，及p标签 替换
10-20
主要介绍了百度编辑器 ueditor 内容编辑自动套P标签，及p标签 替换,需要的朋友可以参考下
百度编辑器ueditor上传图片视频以及div去掉P标签
11-09
【描述】：“解决了p标签替换div标签，解决了上传图片以及上传视频带有p标签的问题”意味着开发者或使用者已经找到了方法，使得在ueditor中插入图片和视频后，不再会自动包裹`<p>`标签，而是用`<div>`标签来代替。...
为什么p元素内不能嵌套Div元素（随笔）
热门推荐
但愿人长久 千里共婵娟
05-14 1万+
在开发中遇到的实际问题。
p标签内不能嵌套div（注解）
weixin_30851409的博客
11-13 113
相关知识： 内联元素可以嵌套内联元素，块级元素可以嵌套部分块级元素并也能嵌套内联元素，但内联元素不能嵌套块级元素。块级元素为block，内联元素为inline，拥有“inline”特性的同时又拥有“block”的特性称为replace元素。 <p> 　　<div>编码美学</div> 　　<div>编码美学</div> <...
p标签内放div
aliven1的博客
01-08 1324
p标签内放div会导致bug,浮动失效，p内最好都是文本
p标签里面不要放div标签（块元素）
weixin_30907935的博客
01-19 822
最好不要在p标签里面嵌套块级元素(如div Ul): <p>我来测试下<div>块元素</div>放在p标签的情况</p> <p>我来测试下<span>内联元素</span>放在p标签的情况</p> <p>我来测试下<ul>块元素ul...
html P嵌套div,HTML里为什么不能在<p>标签中嵌套<div>标签
weixin_31510505的博客
06-17 849
学习过HTML语言的人都应该知道，在HTML里，有分块级元素和内联元素；例如我们常用到的div，o，ul，dl，table，h1...h6等，这些都是块级元素；而像a，b，i，em，img，span等就是内联元素了。在开发过程中，我们避免不了各种元素的嵌套，但是有时候我们在不知不觉中就错误地嵌套元素了。为什么说是不知不觉呢。因为就算我们错误地嵌套了，但是在浏览器中显示的时候，其实是没有区别的。咱们...
标签的嵌套规范
weixin_53024314的博客
02-26 1130
1. 块元素可以嵌套块元素、⾏内元素、⾏内块元素 div可以嵌套任意标签 p标签不能嵌套其他块元素，可以嵌套⾏内元素、⾏内块元素 不推荐标题⾥边嵌套其他块元素，可以嵌套⾏内元素、⾏内块元素 2. ⾏内块不能嵌套块元素，可以嵌套⾏内元素、⾏内块元素 3. ⾏内元素不能嵌套块元素、⾏内块元素，只能嵌套⾏内元素 a标签不能嵌套a标签 总结：块元素>p标签>行内块元素>行内元素 ...
【我不熟悉的html】p标签不能嵌套块元素(p、div等)
qq_17335549的博客
11-08 1148
【我不熟悉的html】p标签不能嵌套块元素(p、div等)
p标签里面不能嵌套div
budaoweng0609的博客
01-23 3183
p标签里面不能嵌套divCSS权威指南》中文字显示：任何不是块级元素的可见元素都是内联元素。其表现的特性是“行布局”形式，这里的“行布局”的意思就是说其表现形式始终以行进行显示。比如，我们设定一个内联元素border-bottom:1px solid #000;时其表现是以每行进行重复，每一行下方都会有一条黑色的细线。如果是块级元素那么所显示的的黑线只会在块的下方出现。p、h1、或div等元素常常
html P嵌套div,p标签不可以嵌套块状标签
weixin_42334285的博客
06-17 1522
html的标签分为两种，块级标签和内联标签。块级标签是一个完整的小主体，比如一个表格，一段内容，一张列表等等，它们包括了p,div，ul，table，h标签。内联标签起的是修饰的作用，它们是 是li，a，b，img，span等，内联标签依附于块级标签使用。我们经常犯的错误是是块级标签的嵌套问题，如果是静态页面，块级标签的嵌套，其浏览器上显示的结果都是一样的。但是对于动态页面而言， 尽管浏览器显示结...
JavaScript中 label标签有什么用.和p标签以及div标签有什么区别
06-08
在HTML中，`label`标签用于关联表单元素和标签文本，它的作用是为表单元素添加标签说明，提高表单的可访问性和可用性。`label`标签的`for`属性指定了关联的表单元素的`id`值，当用户点击标签文本时，就会触发关联的...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值