【实践】关于p 标签内嵌 p标签的bug

项目中遇到了一点小问题:

是这样的,在输入框包裹元素 p标签中想内嵌一个p 标签用作显示提示字符,谁知发生了一下一幕:

页面结构:

<p class="modify-info-wrap">
      <span>二级导航明细:</span>
      <textarea name="second-childNav-content" id="childTagInfo" class="modify-nav-info"></textarea>
      <p id="modify-childNav-hint"></p>
</p>

浏览器效果如下:

提示元素 p标签不见了,变成在外层的包裹标签外面

于是百度了一下,发现原来p 标签里面是不可以内嵌块状元素的,p标签自身也是块状元素,于是里面的p 标签便飙出去了,又是一次很好的经验教训

时间: 2024-10-07 07:47:46

【实践】关于p 标签内嵌 p标签的bug的相关文章

div style标签内嵌CSS样式

我们在DIV标签内.SPAN标签内.p标签等html标签内使用style属性直接设置div的样式. 一.在<div>标签内使用style设置css样式   -   TOP 1.实例html源代码片段: <div style="font-size:14px; color:#F00">设置字体大小14px,颜色为红色</div> 2.div标签内使用style设置样式截图 div标签内设置样式截图 二.在<span>标签内使用style设置c

[19/05/17-星期五] HTML_body标签(内嵌标签)和框架标签

一.内嵌标签 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!--在当前网页嵌入另一个网页,达到不同网页资源之间不相互干扰,并能在同一个页面进行显示 iframe 多用于网页播放器如爱奇艺 src:要显示网页的路径 可以是本地也可以是网络资源 width和height 要显示网页的宽和高 name:设置内嵌区域的名字 结合超链接 --> <title>0

Android TextView setText内嵌html标签

由于得到的数据是保存在数据库里面的,不好对数据的某一部分进行操作.解决办法在数据库里面存数据的时候加上html的标签对, 如data = <中华人名共和国道路交通安全实施条例>第<u> 七十 </u>条第<u> 二 </u>款,通过<U>标签对给部分数据添加下划线. 在给textView设置text的时候添加 mTvText.setText(Html.fromHtml(data));这样就能够自由的控制部分数据的显示格式了,还可以添加

jquery获取点击标签内的子标签内容和值实例

今天有点累了,就不多做其他的描述解释.在插入的代码里相关解释也都有. <!--<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.

Struts2中UI标签之表单标签介绍

1.在Struts2中UI标签的表单标签分为两种:form标签本身和单个表单标签. 2.Struts2表单标签包括:form.textfield.password.radio.checkbox.checkboxlist.select.doubleselect.combobox.optiontransferselect.optgroup.updownselect.textarea.hidden.file.label.submit.token.head.datepicker.reset.richte

表格标签,图片标签,框架标签,表单标签

一)表格标签 <table>标签 表格里面需要设置单元格的行,在行内设置单元格代表该行的列. 通过改变table的属性还有单元格的属性可以设置单元格的跨度,字体,对齐方式等. 示例: <table align="center" border="1px" width="400pt" height="300pt"> <tr> <th colspan="3">学习成

HTMl中的块标签和内嵌标签(内联标签)

块状标签: address - 地址 blockquote - 块引用center - 举中对齐块dir - 目录列表div - 常用块级容易,也是CSS layout的主要标签dl - 定义列表fieldset - form控制组form - 交互表单h1 - 大标题h2 - 副标题h3 - 3级标题h4 - 4级标题h5 - 5级标题h6 - 6级标题hr - 水平分隔线isindex - input promptmenu - 菜单列表noframes - frames可选内容,(对于不支持

HTML - 内嵌标签相关

<html> <head></head> <body> <!-- iframe (内嵌标签) src : 要显示的网页资源路径(本地资源或网络资源) width : 显示区域的宽度 height : 显示区域的高度 --> <iframe src="http://www.baidu.com" width="500px" height="400px"></iframe&g

HTML中为何P标签内不可包含DIV标签?

起因:在做项目时发现原本在DW中无误的代码到了MyEclipse6.0里面却提示N多错误,甚是诧异.于是究其原因,发现块级元素P内是不能嵌套DIV的. 深究:我们先来认识in-line内联元素和block-line块元素,因为HTML里几乎所有元素都属于内联元素或者块元素中的一种. in-line这个词有很多种解释:内嵌.内联.行内.线级等,但是,它们都是表示相同的意思,在这里我们选择习惯的叫法--内联. 先看下面的例子你就能明白两者的差别: <p>测试一下块元素与<span>内联