css :not(否定伪类)用法

最新推荐文章于 2024-02-21 16:17:53 发布
最新推荐文章于 2024-02-21 16:17:53 发布
阅读量4.9k 收藏 1
点赞数 2

:not 否定伪类在优先级计算中不会被看作是伪类. 事实上, 在计算选择器数量时还是会把其中的选择器当做普通选择器进行计数.

这是一块CSS代码:

div.outer p {
  color:orange;
}
div:not(.outer) p {
  color: blueviolet;
}

当它被应用在下面的HTML时:

<div class="outer">
  <p>This is in the outer div.</p>
  <div class="inner">
    <p>This text is in the inner div.</p>
  </div>
</div>

会在屏幕上出现以下结果:

Zebul博
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
css :not_研究：CSS3否定（：NOT）选择器
cune1359的博客
07-04 6836
本文是我们的“ HTML5 / CSS3教程系列”的一部分 -致力于帮助您成为更好的设计师和/或开发人员。 单击此处查看同一系列的更多文章。 CSS有一些选择器，允许您在某些条件下选择元素，例如:hover ， :focus和:active等。但是今天我们将不介绍这些选择器。 我们将研究一种仍然鲜为人知但仍被大多数Web设计人员使用的方法，即:not选择器或也称为否定选择器。 它有什么...
CSS :visited伪类选择器隐秘往事回忆录
09-22
主要介绍了CSS :visited伪类选择器隐秘往事回忆录,需要的朋友可以参考下
网站开发进阶（六十五）css中 :not() 伪类选择器用法
IT全栈 华强工作室
04-13 2327
单条件筛选 单个的not写法： /*选中非段落元素*/ :not(p) { } 在前端项目开发过程中，如果希望某个样式不作用到选择器上，可以使用:not(选择器），如： <input type="text" value="1" /> <input type="text" value="2" /> <input type="text" class="no-red" value="3"/> input[type="text"] { display: block
css3 新加选择器 排除选择器 :not()
热门推荐
sally18的博客
05-29 2万+
css :not()排除函数 css:not()函数用来排除选择，not(x),其中的x为css选择器，但是x不能是not选择器，也就是说:not()排除选择器不能嵌套使用。 css:not()排除选择器使用 .sibcont{ background:#f1f1f1; border:1pxsolid#bababa; margi...
css伪类函数 :is()、:where()、:has()、:not()
最新发布
block_xu的博客
02-21 1345
本文主要描述:is()、:where()、:has()、:not()，四个方法大部分内容相同，首先主要讲:is()方法，并根据:is()方法与:where():has():not()方法的不同来说明这三种方法的特性:is()使用方法选择器特定性安全性伪类和伪元素的支持前空格意义兼容性:is()
CSS a:hover伪类在IE6下的问题
09-25
在处理css的机制上，IE总是有很多让人吐血的举动，但对于他们现在的改进力度还是值得高兴的。
CSS3 :default伪类选择器使用简介
09-24
CSS3 :default 伪类选择器只能作用在表单元素上，表示默认状态的表单元素。接下来通过本文给大家介绍CSS3 :default伪类选择器使用简介，感兴趣的朋友跟随脚本之家小编一起看看吧
css :not的多个条件的写法详解
12-13
:not 伪类选择器可以筛选不符合表达式的元素 例子 table tbody tr:not(:first-child):not(:last-child) td { text-align: right; } 以上代码可以选择table表格中tbody部分非首个、非最后一个的tr，并设置其子元素td文本样式居右 这里面需要注意not的语法格式： 单个的not写法： /*选中非段落元素*/ :not(p) { } 多个not的写法 /*选中div里面非首个、非最后一个的中间p元素*/ div p:not(:first-child):not(:last-child){ }
css :not 选择器
韦大人orz
04-23 1万+
:not 选择器是css3里面的 :not([class]){color:red;} // 没有class属性的元素都设置为红色 如下代码 非 //属性为非aria-checked="true"元素 走.radio-text .van-radio:not([aria-checked="true"]) { .radio-text { color: inherit !important; } } p:not([class]){color:red;} // 没有class属性的p..
CSS结构伪类选择器之否定伪类:not()
joe0235的博客
12-05 3166
结构伪类选择器是针对 HTML 层级结构的伪类选择器。常用的结构化伪类选择器有：:root选择器、:not选择器、:only-child选择器、:first-child选择器、:last-child选择器、:nth-child选择器、:nth-child(n)选择器、:nth-last-child(n)选择器、:nth-of-type(n)选择器、:empty选择器、:target选择器。
css3 :not([class]) css3 :not([style])
Embrace924的博客
02-15 3680
css3 :not([class]) css3 :not([style])
CSS——排除选择器:not()
qq_43201350的博客
10-20 3914
用法 li:not(:first-child){ color:#0C58A7; }
CSS :befor :after 伪元素的巧妙用法
12-12
本篇重点介绍CSS中的:befor、:after创建的伪元素几种使用场景，如填充文本、作为iconfont、进度线、时间线以及几何图形。 1. 介绍 1.1 说明 CSS中的:befor、:after都会创建一个伪元素，其中:befor创建的伪元素是所选...
css伪类选择器记忆技巧,彻底搞懂CSS伪类选择器：is、not
weixin_42467518的博客
08-04 410
本文介绍一下Css伪类:is和:not，并解释一下is、not、matches、any之前的关系:notThe :not() CSS pseudo-class represents elements that do not match a list of selectors. Since it prevents specific items from being selected, it is k...
css中:not()选择器和jQuery中.not()方法
慢谈人生
12-10 474
因为老是将这两个的not方法弄混，所以写一下备忘。 css中:not()选择器用法 :not 伪类选择器可以筛选不符合表达式的元素，:not(selector) 其中的selector为css选择器 ul li:not(:first-child) ul li:not(.text) //不包含class="text"的元素 :not(p) //非段落元素 ul li:not(:first-child):not(:last-child) //not可叠加使用 jQuery中.not()方法
css中你不知道的:not,:is选择器用法
codingWeb的博客
09-13 696
用CSS将div内，在不改变html的前提下，除了P标签，其它的字体颜色变成蓝色 <div class="box"> <span>我是蓝色</span> <p>我是黑色</p> <h1>我是蓝色</h1> <h2>我是蓝色</h2> <h3>我是蓝色</h3> <h4>我是蓝色</h4&g
CSS3 中 :not(),[],&的用法
boyikenan123的博客
04-27 4110
:not 在css中，“:not”是选择器的一种，如果希望某个样式不作用到选择器上，可以使用:not(选择器），语法格式为“ 元素:not(元素id){属性:属性值;}”；该选择器匹配非指定元素/选择器的每个元素。 <div class="item light">A</div> <div class="item">B</div> <div class="item">C</div> <div class="item">D&lt
css 中 not选择器的探索
ColourfulTiger的博客
08-22 7923
在使用css的时候，少不了接触伪类，而not这种选择器之前基本没有写过，在今天遇到后，就来和大家一起探索探索。 1、案例1： &lt;style&gt; p{ color:#000000; } :not(p){ color:#ff0000; } &lt;/style&gt; &lt;div class="te...
css :not_用：not否定CSS规则
cungui5726的博客
08-20 1234
css :notTraditional web design has been about crafting a series of explicit declarations with inline, embedded and linked styles. Weaving through the different layers of stylesheets, these CSS rules c...
css通过nth:child和伪类控制不同列的样式
09-08
CSS中的nth-child伪类可以通过选择特定的子元素来控制不同列的样式。这个伪类可以使用公式n来选择元素...通过使用nth-child伪类和其他CSS属性，可以很方便地控制不同列的样式，从而实现更多的个性化和美观的设计效果。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值