如果子p标记为空，则隐藏div块

是通过CSS样式来实现的。可以使用display属性来控制元素的显示与隐藏。当子p标记为空时，可以通过设置div块的display属性为none来隐藏它。

CSS样式代码示例：

div {
  display: none;
}

这样设置后，当子p标记为空时，对应的div块将不会显示在页面上。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）腾讯云云服务器（Cloud Virtual Machine，简称CVM）是腾讯云提供的一种弹性计算服务，可帮助用户快速构建和部署应用程序。CVM提供了多种配置和规格的云服务器实例，支持多种操作系统和应用场景，具备高性能、高可靠性和高可扩展性。

产品介绍链接地址：腾讯云云服务器（CVM）

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

【CSS】CSS 总结 ⑦ ( 定位 | 静态定位 | 相对定位 | 绝对定位 | 子绝父相 | 固定定位 | 使用绝对定位设置水平垂直居中 | 堆叠顺序 | 显示模式 | 元素隐藏 ) ★

; 如果父容器没有定位 , 则相对于浏览器左上角位置进行定位 ; 再次引申 , 如果父容器没有定位 , 则查找父容器的父容器是否有定位 , 如果有则相对于爷爷容器进行定位 ; 上述父容器的定位...边偏移移动位置 ; 如果绝对定位的元素的父级元素没有定位 , 那么会一直向上查找有定位的父级元素 , 直到浏览器 ; 绝对定位元素不保留原来的位置 , 是完全脱离标准流的 ( 脱标...class="one"> 显示效果 : 12、z-index...; 如果想要显示该对象 , 为该元素设置 display: block 即可 ; 设置 display: block 可以显示元素 , 同时该样式还可以将元素转为块元素 ; 使用 display 隐藏元素...: 不管子元素是否超出父容器 , 都显示滚动条 ; auto : 如果子元素超出父容器显示滚动条 , 如果子元素没有超出父容器不显示滚动条 ; 效果参考【CSS】清除浮动 ② ( 清除浮动 - 父级元素设置

1941 0

web前端页面布局学习

p=2 默认未设置定位父元素宽度最大填充父元素，高度正好容纳子元素。...如果子元素左浮动，则宽度仍在容纳子元素的基础上最大填充父元素，高度正好容纳子元素如果子元素右浮动，则宽度正好容纳子元素，高度正好容纳子元素这是因为子元素默认就是独占一行，向左对齐的。...子元素的浮动是基于父元素框体的浮动可以通过CSS clear清除 Display属性 none,inline,block,inline-block,table-cell,flex 每个元素都有一个display属性，如div...的display属性为block(块元素)，而span元素的display属性为inline(行内元素) 行内元素（inline）： 1.没有宽高属性，不会独占一行如span,设置宽高均无用 2.行内元素一旦设置了...隐藏元素 display:none;隐藏元素，不保留物理空间 visibility:hidden;隐藏元素，保留物理空间定位值描述 absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位

1K3 0

CSS学习笔记（基础篇）

4.6K3 0

css(2)

使块级元素变成行内元素 inline-block 使元素同时具有行内元素和块级元素的特点 display的none和visibility的hidden的区别：两者都可以隐藏元素，但是display将元素隐藏之后...（需要说明的，浮动的框可以覆盖固定的框，但是覆盖不了固定框的文本内容，这些文本内容会被挤出到浮动框下方显示）（另外本人试的浮动的p标签改成的块标签无法覆盖固定的块标签div，但是浮动的div可以。）...浮动的应用场景：浮动多用于页面的功能块的搭建，如小米商城的页面，就大量使用了浮动。...浮动常用的三种方式：l left 向左浮动 right 向有浮动 none 默认值，不浮动 1.8.1浮动带来的影响会使浮动框的父标签塌陷，就是当边框是父标签的时，如果子标签设置为浮动，则外边框就会塌陷成一条线...id="d1" class="c2 clearfix"> div2 p 1.9overflow

1.5K2 0

Day7:html和css

Day7:html和css 如果有浮动,会导致脱标,定位也能脱标,我们没有清除浮动,因为里面有子绝父相....清除浮动的方法额外标签法,在最后一个浮动元素后面添加一个空的标签代码: 使用after伪元素进行清除浮动. .clearfix:after.../*visibility: visible; 显示某个元素*/ visibility: hidden; // 隐藏元素 } p { width...> 达叔小生使用dispaly: none后隐藏对象,不保留位置. visibility visibility: inherit |...visible | collapse | hidden vertical-align垂直对齐针对行内块元素. vertical-align: baseline | top | middle | bottom

1.9K3 0

CSS中用 opacity、visibility、display 属性将元素隐藏的对比分析

黄色块div元素使用 opacity:0; 时 ? 黄色块div元素使用 visibility:hidden; 时 ? 黄色块div元素使用 display:none; 时 ?...对子元素的影响如果子元素什么都不设置的话，都会受父元素的影响，和父元素的显示效果一样，我们就来举例看看，如果子元素设置的值和父元素设置的值不同会有什么效果。例子（opacity属性） ...黄色块div元素设置 opacity:0;，通过定位，遮挡住了蓝色的p元素，当鼠标移到蓝色p元素上时，并没有触发蓝色p元素的事件。例子（visibility属性） <!...黄色块div元素设置 visibility:hidden;，通过定位，虽然遮挡住了蓝色的p元素，但是当鼠标移到蓝色p元素上时，还是触发了蓝色p元素绑定的事件。

1.7K1 0

5分钟快速回顾HTML CSS

即使通过css设置宽度width,也会占一行的位置) div(无语义) 列表 ur/ol/li 段落 p 标题 h1-h6 自定义列表 dl/dt/dd 其它常见问题块元素的居中问题...span(无语义) 超链接标签 a src可以为空,但一定要写其它常见问题子级内联元素之间有间隙,可以把父级元素font-size设置为0,子级单独设置font-size 内联元素居中...link rel="stylesheet" href="..css/index.css"> (四)选择器层级选择器div p{} 标签选择器 p{} 多标签同时选 p,span{} 直接子类选择器...important 权重1000:内联样式 style 权重100:ID选择器权重10:伪类, :hover 权重为1:div.p (五)容易忘的属性字体 color: red; 清除下划线...display: inline-block; 块元素 display: block; 隐藏元素 display: none; ?

1.3K9 0

【万字长文】TypeScript入门指南

如果参数类型不同，则参数类型应设置为 any。参数数量不同你可以将不同的参数设置为可选。为了让编译器能够选择正确的检查类型，它与 JavaScript 里的处理流程相似。...');//读取div 这种需要类型断言或者加个判断应为读不到返回nulllet div:HTMLElement = document.querySelector('div') as HTMLDivElementdocument.addEventListener...，子类可以继承并重写父类的非静态方法对于静态属性，子类可以继承父类的静态属性，但是如何和非静态属性一样时，会被隐藏对于静态方法，子类可以继承父类的静态方法，但是不能重写静态方法，同名时会隐藏父类的注...：静态属性、静态方法、非静态属性都可以被继承和隐藏，但是不可以被重写，非静态方法可以被重写和继承静态代码块的作用：一般情况下，有些代码需要在项目启动的时候就执行，这时候就需要静态代码块，比如一个项目启动需要加载配置文件...:string){//construct：构造器 this.name = name } //abstract getName(){//方法getName不能具有实现，因为它标记为抽象

5074 2

CSS 浮动（二）

块级元素会独占一行，从上向下顺序排列。常用元素：div、hr、p、h1~h6、ul、ol、dl、form、table 行内元素会按照顺序，从左到右顺序排列，碰到父元素边缘则自动换行。...如何让多个块级盒子(div)水平排列成一行？比较难，虽然转换为行内块元素可以实现一行显示，但是他们之间会有大的空白缝隙，很难控制。\ 如何实现两个盒子的左右对齐？...因为浮动可以改变元素标签默认的排列方式浮动最典型的应用：可以让多个块级元素一行内排列显示。网页布局第一准则：多个块级元素纵向排列找标准流，多个块级元素横向排列找浮动 3 什么是浮动？...浮动元素会脱离标准流(脱标) 浮动的元素会一行内显示并且元素顶部对齐浮动的元素会具有行内块元素的特性. 5 浮动的使用浮动元素经常和标准流父级搭配使用为了约束浮动元素位置, 我们网页布局一般采取的策略是...例如，或者其他标签如优点：通俗易懂，书写方便缺点：添加许多无意义的标签，结构化较差注意：要求这个新的空标签必须是块级元素代码 > 父级添加 overflow 可以给父级添加

1391 0

CSS浮动知识

CSS 布局的三种机制有普通流（标准流）、浮动和定位普通流（标准流）块级元素会独占一行，从上向下**顺序排列；常用元素：div、hr、p、h1~h6、ul、ol、dl、form、table 行内元素会按照顺序...，从左到右**顺序排列，碰到父元素边缘则自动换行；常用元素：span、a、i、em等浮动让盒子从普通流中浮起来,主要作用让多个块级盒子一行显示。...俗称 “脱标” ?...体验案例——div 水平排列 div { width: 200px; height: 200px; background-color: pink; /* 转换为行内块元素...优点：代码简洁缺点：内容增多时候容易造成不会自动换行导致内容被隐藏掉，无法显示需要溢出的元素。

1.7K2 0

前端零基础教学开始第六天 06 – day 多种定位方法和精灵图使用元素的显示与隐藏…

absolute 绝对定位有两个重要的概念 1、完全脱标 —-完全不占位 2、父元素要有定位 —- 父元素在标准六中的位置 + 边偏移属性来设置元素的位置复制代码固定定位固定定位 1、完全脱标 — 完全不占位 2、只认浏览器的可视窗口,就是人看见的浏览器的地方 3、不随着滚动条滚动复制代码行内块元素特性特性...-- 如果里面没有内容就是空的一行是0 --> 浮动脱离复制代码综合定位Demo < 左箭头 >右箭头复制代码 <!...显示 display:none 隐藏对象与它相反的是display:block除了转换为块元素之外，同时还有显示元素的意思特点：隐藏之后，不在保留位置 visibility 可见性设置或检索是否显示对象

3.5K2 0

前端之HTML和CSS

3、通用块容器标签，表示文档中一块内容，具有块元素基本特性，没有其他默认样式这是一个div元素这是第二个div元素 <h3...带语义的标签 1、h1~h6：表示标题 2、p：表示段落 3、img：表示图片 4、a：表示链接不带语义的标签 1、div：表示一块内容 2、span：表示行内的一块内容所以我们要根据网页上显示的内容...text-indent 设置文字首行缩进，如：text-indent:24px; 设置文字首行缩进24px display属性 display属性是用来设置元素的类型及隐藏的，常用的属性有： 1、none...元素隐藏且不占位置 2、block 元素以块元素显示 css元素溢出当子元素的尺寸超过父元素的尺寸时，需要设置父元素显示溢出的子元素的方式，设置的方法是通过overflow属性来设置。...外间距居中技巧　　如果子元素是块元素，且它的宽度小于父元素，可以将子元素左右设置auto来水平居中子元素 /* 子元素上下外边距设为0，左右设置为auto */ margin:0px auto 盒子的真实尺寸

4.3K3 0

1.4K1 0

「学习笔记」CSS基础

3.2K3 0

深入理解和应用Float属性

1.1K10 0

CSS入门？一篇就够了！

常见的块元素有~、、、、、等，其中标签是最典型的块元素。...（a特殊）注意：只有文字才能组成段落因此 p 里面不能放块级元素，同理还有这些标签h1,h2,h3,h4,h5,h6,dt，他们都是文字类块级标签，里面不能放其他块级元素。...相邻块元素垂直外边距的合并当上下相邻的两个块元素相遇时，如果上面的元素有下外边距margin-bottom，下面的元素有上外边距margin-top，则他们之间的垂直间距不是margin-bottom...（相对定位不脱标）如果说浮动的主要目的是让多个块级元素一行显示，那么定位的主要价值就是移动位置，让盒子到我们想要的位置上去。...display : none 隐藏对象与它相反的是 display:block 除了转换为块级元素之外，同时还有显示元素的意思。特点：隐藏之后，不再保留位置。

5.2K2 0

CSS3

例如：h系列，p，div…… > 行内元素/行内块元素一行显示多个 ==> 水平布局。...class="div1">俺是div块级元素俺是div块级元素原来的div还在那占着位置 ...—>子绝父相)： 1.若父级(/爷级…..)有定位属性，根据父级为参照进行定位 2.若父级无定位属性，根据浏览器窗口进行定位且具备了行内块特点，可设置宽高。在页面中不占位置—>已经脱标。...脱标(在页面中不占位置)。...解决：overflow 案例： ---- 元素本身隐藏场景：例如某些网站的导航，当鼠标悬停会出现元素常见属性： 1.visibility：hidden/占位隐藏/ 2.display：none

7739 0

CSS技巧（一）：清除浮动

{ float: right; } some text ?...清除浮动方法方法一：使用带clear属性的空元素在浮动元素后使用一个空元素如，并在CSS中赋予.clear{clear:both;}属性即可清理浮动...text 优点：简单，代码少，浏览器兼容性好。...总结通过上面的例子，我们不难发现清除浮动的方法可以分成两类：一是利用 clear 属性，包括在浮动元素末尾添加一个带有 clear: both 属性的空 div 来闭合元素，其实利用 :after...推荐在网页主要布局时使用:after伪元素方法并作为主要清理浮动方式；在小模块如ul里使用overflow:hidden;（留意可能产生的隐藏溢出元素问题）；如果本身就是浮动元素则可自动清除内部浮动

8031 1

【CSS3】css开篇基础（4）

块级元素会独占一行，从上向下顺序排列。行内元素会按照顺序，从左到右顺序排列，碰到父元素边缘则自动换行。以上都是标准流布局，我们前面学习的就是标准流，标准流是最基本的布局方式。...浮动元素会脱离标准流（脱标）浮动的元素会一行内显示并且元素顶部对齐浮动的元素会具有行内块元素的特性浮动元素会脱离标准流（脱标）脱离标准普通流的控制（浮）移动到指定位置（动），（俗称脱标）浮动的盒子不再保留原先的位置...class="box1">浮动的盒子标准流的盒子浮动的元素会一行内显示并且元素顶部对齐如果多个盒子都设置了浮动...，则它们会按照属性值一行内显示并且顶端对齐排列。...5.显示和隐藏元素 display 属性可以用于设置一个元素应如何显示, display:none;隐藏对象 display:block;除了转换为块级元素之外，同时还有显示元素的意思 display

631 0

前端学习(14)~css学习(八)：定位属性

绝对定位之后，标签就不区分所谓的行内元素、块级元素了，不需要display:block就可以设置宽、高了。...但是在工程上，如果子绝、父绝，没有一个盒子在标准流里面了，所以页面就不稳固，没有任何实战用途。工程应用： “子绝父相”有意义：这样可以保证父亲没有脱标，儿子脱标在父亲的范围里面移动。...（3）绝对定位的儿子，无视参考的那个盒子的padding：下图中，绿色部分是父亲div的padding，蓝色部分p是div的内容区域。...此时，如果div相对定位，p绝对定位，那么， p将无视父亲的padding，在border内侧为参考点，进行定位： ?...可如果盒子是绝对定位的，此时已经脱标了，如果还想让其居中（位于父亲的正中间），可以这样做： div { width: 600px; height: 60px;

9222 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云