1、选中没有子元素/子元素为空的p标签 p:empty 2、选中有子元素的p标签 p:not(:empty)
当我们想要根据元素内部是否有内容来显示特定的样式时 我们可以使用:not 与:empty结合来实现这个效果 代码如下 代码语言:javascript 复制 .handle_menu_content:not(:empty){width:90px;position:fixed;z-index:999999;top:0;z-index:9999999;left:38px;background:#fff;border-radius:3px;border:1px solid #B3CA...
2.not选择器 如果想对某个结构元素使用样式,但是想排除这个结构元素下面的子结构元素,让它不使用这个样式时,可以使用not选择器。 body*:not(h1){ background:yellow; } 3.empty选择器 适用empty选择器来指定当元素中内容为空白时使用的样式。 :empty{ background:yellow; } 4.target选择器 使用target选择器来...
input:not(:empty):not(:focus):invalid { border-color: #A22; box-shadow: none } 如果我删除 :not(:empty) 部分,它工作得很好。即使我将选择器更改为 input:not(:empty) 它仍然不会选择已输入文本的输入字段。这是坏了还是我只是不允许在 :not() 选择器中使用 :empty --- ? 我唯一能想到的另一...
SDK中心 软件开发生产线 AI开发生产线 数据治理生产线 数字内容生产线 开发者Programs Huawei Cloud ...
首先,我们来看4个最基本的结构性伪类选择器—root选择器、not选择器、empty选择器与target选择器。 1. root选择器 root选择器将样式绑定到页面的根元素中。根元素是指位于文档树中最顶层结构的元素,在HTML页面中就是指包含着整个页面的“”部分。 代码清单16-8为一个HTML页面,在该页面中,有一段文章,并且有一...
假定有这样一个 figcaption 元素,其中不包含任何文本,我们该如何处理?对于这种情况,只要使用:not 和 :empty 选择器即可快速检查其内容。 与图形修饰类似,我们还可以在多个段落间切换各个引用块的文本对齐方式,具体请参阅此处的实际效果:https://codepen.io/_rahul/pen/MWQZXoY ...
:empty选择器、:target选择器。 这些基本上都很常用,今天着重说下:否定伪类:not() 否定伪类特别有用,在css中, :not选择器 用于匹配非指定元素/选择器的每个元素,语法格式: :not(selector) 比如:假设我想选择所有 div,除了 id 为 的那个 container。下面代码: ...
选择:empty器的目标元素是在其开始和结束标记之间没有内容的元素。这对于隐藏或设置空元素的样式非常方便,例如空 div 或段落: 代码语言:javascript 复制 div:empty{display:none;} 在此示例中,空元素将从视图中隐藏。 6. [属性^="值"]选择器: 带有“...
input:not([type=“submit”]){ border:1px solid red; } CSS3 结构性伪类选择器—empty :empty选择器表示的就是空。用来选择没有任何内容的元素,这里没有内容指的是一点内容都没有,哪怕是一个空格 CSS3 结构性伪类选择器—target :target选择器称为目标选择器,用来匹配文档(页面)的url的某个标志符的目标...