htmlP标签不能嵌套div的原因-成都创新互联网站建设

成都创新互联网站制作

028-86922220

关于创新互联

多方位宣传企业产品与服务 突出企业形象

公司简介 公司的服务 荣誉资质 新闻动态 联系我们

htmlP标签不能嵌套div的原因

小编给大家分享一下html P标签不能嵌套div的原因，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

为历下等地区用户提供了全套网页设计制作服务，及历下网站建设行业解决方案。主营业务为网站制作、网站设计、历下网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！

html P标签标签定义及使用说明：

标签定义段落。

元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。

html P标签的属性：

html P标签不能嵌套div的原因

HTML中P标签内为什么不能嵌套div标签

深究：

我们先来认识in-line内联元素和block-line块元素，因为HTML里几乎所有元素都属于内联元素或者块元素中的一种。

in-line这个词有很多种解释：内嵌、内联、行内、线级等，但是，它们都是表示相同的意思，在这里我们选择习惯的叫法-内联。

先看下面的例子你就能明白两者的差别：

    
测试一下块元素与内联元素的差别

    
测试一下
块元素
与内联元素的差别

上面的例子自己随便实践一下就知道效果了，这里就不占用空间了，

会自己产生一个新的行，而并没有换行,这是在没有CSS渲染的情况下才这样，同样，我们也可以通过CSS把div定义成内联元素，把span定义成块元素，但是，我们却不能在HTML里任意转化它们，块元素可以包含内联元素或某些块元素（上面的例子其实是错误的使用--->我把
放在

里面了) ，但内联元素却不能包含块元素，它只能包含其他的内联元素，再看看这个：

我喜欢在创新互联讨论Web标准的原因。

其中

是属于块元素，而是属于内联元素，

包含是没有错误的，同样，
可以包含

，

包含也是对的，但是如果是下面这样的话，就是错误的，因为内联元素不应该包含块元素：

   
这样是错误的用法！

还有一些情况就是一些块元素不可以包含另一些块元素。例如这样：

   
测试文字
    < ul>
        li>现阶段是不能这样用的，要等到XHTML 2.0才可以这样用。
    
       测试文字

而这样又是可以的。

   
    
         
  • 这样是可以的
    •

为什么呢？因为我们使用的DTD中规定了块级元素是不能放在

里面的，再加上一些浏览器纵容这样的写法：

这是一个段落的开始

这是另一个段落的开始

当一个

签还没结束时，遇到下一个块元素就会把自己结束掉，其实浏览器是把它们处理成这样：

    
这是一个段落的开始

    
这是另一个段落的开始

所以刚才那样的写法会变成这样：

测试文字

    
    
         
  • 现阶段是不能这样用的，要等到XHTML 2.0才可以这样用。
    •

测试文字

这也是跟刚才说第一个例子中

里面放

不合理是同一个道理。

那哪些块元素里面不能放哪些块元素呢？我知道你有这个疑问，也知道我仅仅列一张清单你不好记住它们。我们可以先把所有的块元素再次划分成几个级别的，我们已经知道是在最外层，下一级里面只会有、、、，而我们已经知道了可视的元素只会出现在<body>里，所以我们把<body>划在第一个级里面，接着，把不可以自由嵌套的元素划在第三个级，其他的就归进第二个级。</p><p>所谓的不可自由嵌套的元素就是里面只能放内联元素的，它们包括有：标题标记的<h2>、<h3>、<h4>、<h5>、<h6>、<h7>、<caption>；段落标记的<p>；分隔线<hr>和一个特别的元素<dt>(它只存在于列表元素<dl>的子一级)。</p><p><strong>兼容性注释</strong></p><p>在 HTML 4.01 中，不赞成使用 p 元素的 align 属性；在 XHTML 1.0 Strict DTD 中，不支持 p 元素的 align 属性。</p><p>请使用 CSS 代替。</p><p>CSS 语法：</p><pre><p style="text-align:right"></pre><p><strong>html P标签的css样式的实例：</strong></p><p>1.“ text-left ”、“ text-right ”、“ text-center ”属性控制<p>标签内容位置</p><pre> <p class="text-left">在左</p> <p class="text-right">在右</p> <p class="text-center">居中</p></pre><p>2.“ text-lowercase ”、“ text-uppercase ”、“ text-capitalize ”属性控制<p>标签英文内容的大小写</p><pre> <p class="text-lowercase">hahahahhahahaha都小写</p> <p class="text-uppercase">hahahahhahahaha都大写</p> <p class="text-capitalize">hahahahhahahaha首字母大写</p></pre><p>3.字体：“text-muted ”、“text-info ”、“text-success ”、“text-warning ”、“text-primary ”、“text-danger ”等属性，对不同情况下的内容进行不同颜色的标注</p><pre> <p class="text-muted">text-muted</p> <p class="text-info">text-info</p> <p class="text-success">text-success</p> <p class="text-warning">text-warning</p> <p class="text-primary">text-primary</p> <p class="text-danger">text-danger</p></pre><p>4.背景：“bg-muted ”、“bg-info ”、“bg-success ”、“bg-warning ”、“bg-primary ”、“bg-danger ”等属性，对不同情况下的内容进行不同颜色背景的标注</p><pre> <p class="bg-muted">bg-muted</p> <p class="bg-info">bg-info</p> <p class="bg-success">bg-success</p> <p class="bg-warning">bg-warning</p> <p class="bg-primary">bg-primary</p> <p class="bg-danger">bg-danger</p></pre><p>以上是html P标签不能嵌套div的原因的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！</p> <br> 分享名称：htmlP标签不能嵌套div的原因 <br> 链接URL：<a href="http://kswsj.cn/article/jechio.html">http://kswsj.cn/article/jechio.html</a> </div> </div> <div class="other"> <h3>其他资讯</h3> <ul> <li> <a href="/article/dchespj.html">腾讯云服务器99 腾讯云服务器guan网首页</a> </li><li> <a href="/article/dcheedc.html">linuxld命令详解 linux ldl</a> </li><li> <a href="/article/dcheshj.html">sap系统里面的采购订单的简单介绍</a> </li><li> <a href="/article/dchessp.html">3322怎么注册域名 如何注册好的域名</a> </li><li> <a href="/article/dcheedh.html">源代码教育Java视频 java源代码分析</a> </li> </ul> </div> </div> <div class="line"></div> <!--底部--> <footer id="5"> <div class="foot1 container"> <div class="list"> <div class="item"> <a href="javascript:;"> <span class="ico1"><i class="iconfont">&#xe661;</i><img src="/Public/Home/img/ewm.png" alt=""></span> <strong>关注我们</strong> </a> </div> <div class="item"> <a href="" target="_blank"> <span><i class="iconfont">&#xe63c;</i></span> <strong>索要报价</strong> </a> </div> <div class="item"> <a href="" target="_blank"> <span><i class="iconfont">&#xe624;</i></span> <strong>我要咨询</strong> </a> </div> <div class="item"> <a href="" target="_blank"> <span><i class="iconfont">&#xe63e;</i></span> <strong>找到我们</strong> </a> </div> <div class="item"> <a href="" target="_blank"> <span><i class="iconfont">&#xe6cb;</i></span> <strong>投诉建议</strong> </a> </div> </div> <div class="tel"> <dl> <tel><a href="tel:400-028-6601" target="_blank">400-028-6601</a></tel><br> <span>也许您需要专业的服务，欢迎来电咨询</span> </dl> <dl> <tel><a href="tel:18980820575" target="_blank">18980820575</a></tel><br> <span>您的需求，是我们前进的动力</span> </dl> </div> </div> <div class="friend"> <div class="container"> <span class="tit">友情链接：</span> <div class="inner"> <a href="https://www.cdcxhl.com/" target="_blank">网站建设公司</a><a href="https://www.cdcxhl.com/ruanwen/" target="_blank">软文发稿投放</a><a href="https://www.cdcxhl.com/qiye.html" target="_blank">成都企业网站建设公司</a><a href="https://www.cdcxhl.com/xiyun.html" target="_blank">移动主机托管</a><a href="https://www.cdcxhl.com/tuoguan/" target="_blank">IDC机房托管</a><a href="https://www.cdcxhl.com/yingxiao.html" target="_blank">成都营销网站建设</a><a href="https://www.cdcxhl.com/quanwang.html" target="_blank">全网营销推广</a><a href="https://www.cdcxhl.com/gaofang/" target="_blank">高防服务器租用</a><a href="https://www.cdcxhl.com/xiangyingshi.html" target="_blank">成都响应式网站设计</a><a href="https://www.cdcxhl.com/xiaochengx.html" target="_blank">小程序开发公司</a><a href="https://www.cdcxhl.com/hangyead/" target="_blank">一元广告</a><a href="https://www.cdcxhl.com/xiaochengx.html" target="_blank">小程序开发</a><a href="https://www.cdcxhl.com/gaofang/" target="_blank">高防主机租用</a><a href="https://www.cdcxhl.com/shoulu/" target="_blank">网站免费收录</a><a href="https://www.cdcxhl.com/zuyong/" target="_blank">成都租用服务器</a><a href="https://www.cdcxhl.com/hangyead/" target="_blank">广告投放平台</a><a href="https://www.cdcxhl.com/cloud/" target="_blank">成都云服务器租用</a><a href="https://www.cdcxhl.com/jigui/" target="_blank">成都机柜租用</a> </div> </div> </div> <div class="foot"> <div class="container"> <div class="footNav"> <h3>网站建设</h3> <a href="https://www.cdcxhl.com/qiye.html" target="_blank">成都企业网站建设</a><a href="http://www.cdkjz.cn/wangzhan/yingxiao/" target="_blank">成都营销型网站建设</a><a href="https://www.cdcxhl.com/" target="_blank">网站建设公司</a> </div> <div class="footNav"> <h3>服务器托管</h3> <a href="https://www.cdcxhl.com/idc/cqwld.html" target="_blank">重庆电信五里店机房托管</a><a href="https://www.xwcx.net/" target="_blank">成都机柜租用</a><a href="https://www.cdcxhl.com/idc/wenjiang.html" target="_blank">温江服务器托管</a> </div> <div class="footNav"> <h3>网站制作</h3> <a href="http://chengdu.cdxwcx.cn/" target="_blank">成都网站制作</a><a href="https://www.cdxwcx.com/wangzhan/mbqiye.html" target="_blank">成都企业网站制作</a><a href="http://www.kswcd.com/mobile/" target="_blank">手机网站制作</a> </div> <div class="footNav"> <h3>企业服务</h3> <a href="https://www.cdcxhl.com/service/wenwangwen.html" target="_blank">网络文化经营许可证</a><a href="https://www.cdcxhl.com/mianfei/jianzhan/" target="_blank">免费建站模板</a><a href="https://www.cdcxhl.com/hangyead/" target="_blank">一元广告</a> </div> <div class="fr ecode"> <div class="fl"> <img src="/Public/Home/img/ewm.jpg"> <p>关注企业微信</p> </div> <div class="fr slogan"> <p class="icon"> <a class="ph" href=""><i class="iconfont">&#xe68d;</i></a> <a class="qq" href="tencent://message/?uin=1683211881&amp;Site=&amp;Menu=yes"><i class="iconfont">&#xe612;</i></a> </p> <p> <i>想要找 </i> <a href="">小程序开发</a>、<a href="">APP开发</a>、 <a href="">营销型网站建设</a>、<a href="">网站建设</a>、 <i><a href="">网站定制开发</a></i> ，就选<a href="">创新互联</a> </p> </div> </div> </div> <div class="bottom container"> <p class="fl"> 版权所有：成都创新互联科技有限公司 备案号：<a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">蜀ICP备19037934号</a> 服务热线：028-86922220 </p> <p class="fr"> <a href="https://www.cdxwcx.com/" target="_blank">成都网站建设</a>： <a href="https://www.cdcxhl.com/" target="_blank">创新互联</a> </p> </div> </div> </footer> <!--在线咨询--> <div class="fot"> <ul> <li> <a href="https://p.qiao.baidu.com/cps/mobileChat?siteId=11284691&userId=6256368&type=1&reqParam=%20{%22from%22:0,%22sessionid%22:%22%22,%22siteId%22:%2211284691%22,%22tid%22:%22-1%22,%22userId%22:%226256368%22,%22ttype%22:1,%22siteConfig%22:%20{%22eid%22:%226256368%22,%22queuing%22:%22%22,%22siteToken%22:%226ce441ff9e2d6bedbdfc2a4138de449e%22,%22userId%22:%226256368%22,%22isGray%22:%22false%22,%22wsUrl%22:%22wss://p.qiao.baidu.com/cps3/websocket%22,%22likeVersion%22:%22generic%22,%22siteId%22:%2211284691%22,%22online%22:%22true%22,%22webRoot%22:%22//p.qiao.baidu.com/cps3/%22,%22bid%22:%22160142915792139572%22,%22isSmallFlow%22:0,%22isPreonline%22:0,%22invited%22:0%20},%22config%22:%20{%22themeColor%22:%224d74fa%22%20}%20}&appId=&referer=&iswechat=0&expectWaiter=-1&openid=null&otherParam=null&telephone=null&speedLogId=null&eid=null&siteToken=6ce441ff9e2d6bedbdfc2a4138de449e" target="_blank"> <img src="/Public/Home/img/fot1.png" alt=""> <p>在线咨询</p> </a> </li> <li> <a href="tel:18980820575" target="_blank"> <img src="/Public/Home/img/fot2.png" alt=""> <p>拨打电话</p> </a> </li> </ul> </div> </body> </html> <script> $(".con img").each(function(){ var src = $(this).attr("src"); //获取图片地址 var str=new RegExp("http"); var result=str.test(src); if(result==false){ var url = "https://www.cdcxhl.com"+src; //绝对路径 $(this).attr("src",url); } }); window.onload=function(){ document.oncontextmenu=function(){ return false; } } </script>