为什么 CSS :not 伪类不能按预期工作?

2024-01-07

考虑以下 HTML:

<div class="a">
    <div class="b">Hello</div>
  </div>
  <div class="c">
    <div class="b">World</div>
</div>

按照预期添加以下 CSS 颜色,仅“世界”为红色:

.c .b {
  color: red;
}

但是,添加以下 CSS“Hello”和“World”都为红色 http://jsbin.com/odubod/3:

:not(.a) .b {
  color: red;
}

Why?


你需要这样给出:-

Demo http://jsfiddle.net/xHRqF/

div:not(.a) .b {
  color: red;
}

伪类:不是 http://www.w3.org/wiki/CSS/Selectors/pseudo-classes/%3anot

语法为选择器:not(){属性}

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

为什么 CSS :not 伪类不能按预期工作? 的相关文章

  • 如何在鼠标悬停时覆盖 div / box?

    我有一个链接 当用户将鼠标悬停在其上时 它应该在链接下显示一个框 div 盒子应该覆盖其下方的所有内容 我如何使用 css 或 javascript 来做到这一点 您有一个隐藏的绝对定位的 div 和链接的子级 然后 当您将鼠标悬停在链接上
  • jQuery / Javascript - 检测 WooCommerce 商店通知 html 是否可见

    我正在寻找一种方法来确定使用 JavaScript jQuery 是否显示 WooCommerce 商店通知 商店通知的 HTML 看起来像这样 p class woocommerce store notice demo store sty
  • 如何设置 div 高度来填充可用空间

    我有一个 3 列布局 列下方有一些详细信息 您会注意到其中一列的高度大于其他列的高度 我希望其他两个 div 自动填充剩余空间 直到蓝色 div 文本将动态加载 因此我需要它与任何更大的列 并且任意数量 一起使用 这可以通过 HTML CS
  • CSS - 单个图像文件与多个文件的优点

    我注意到现在很多网站将所有图像都放在单个文件中 然后使用背景位置来偏移屏幕上显示的矩形 这是出于性能原因吗 如果是这样为什么 这称为 CSS 精灵 使用它有几个原因 对服务器的请求更少 文件大小稍小 因为大图像比单独的图像要小一些 预加载图
  • 需要为每个图例文本高图应用背景颜色

    正如我在问题中所说 我希望改变我的传奇 例如 FROM TO 我已经尝试过这个背景颜色 legend backgroundColor CCC layout horizontal floating true align left vertic
  • Internet Explorer 9 中图像地图周围的蓝色边框

    我遇到了以下问题 我在网站上使用图像地图 在 Internet Explorer 9 IE8 很好 中 当我单击链接 区域标签 时 它周围会出现蓝色边框 如何摆脱它 我试过了 map map area border none importa
  • 文本输入框作为 SVG 中的“foreignObject” - 文本溢出问题

    我使用 foreignObject 标签在 svg 中有一个文本输入框 这很有效 但是如果您在输入框中输入的内容比其宽度长 从而导致其溢出 那么文本实际上会出现在页面上的其他位置 可能是没有外来对象标记的默认位置 这是一些屏幕截图来解释正在
  • 无法删除重叠的框阴影

    更具体地说 我使用的是聚合物纸影 我正在尝试删除一个的两侧paper shadowbox 来创建一个简单的箭头框 但我似乎无法摆脱它 我试过删除position absolute 但这似乎并没有消除重叠的行为 这是我的 html css 的
  • HTML5旋转动画——如何显示“硬币的另一面”?

    考虑到这个 JSFiddle 旋转示例 https jsfiddle net 194288aw HTML div class container div class coin div class face heads Hey div div
  • 水平离子涡旋不工作

    在我正在制作的项目中 我使用了离子滚动两次并且工作完美 垂直模式 但现在我尝试进行水平滚动并且不起作用 滚动出现但我无法滚动任何内容 HTML 代码很简单
  • 在每个打印页上重复水印? JavaScript 或 CSS

    所以 我有这个发票页面 我正在页面后面添加水印 我需要为要打印的每一页重复水印 问题是 我不知道会有多少页 可以有任意数量的页面 我需要在每个页面后面显示水印 这些图像取自 Google Chrome 的打印模式 这是该页面的 html 你
  • 是否可以将CSS应用于半个字符?

    我在寻找什么 一种打造风格的方法HALF一个角色的 在这种情况下 一半的字母是透明的 我目前搜索和尝试过的内容 没有运气 设置半个字符 字母样式的方法 使用 CSS 或 JavaScript 设置字符的一部分样式 将 CSS 应用于字符的
  • 有 CSS 的替代品吗?

    是否有替代 CSS 的样式表格式化语言 或者 CSS 是当前用于执行样式表格式化类型操作的单一语言 我查看了维基百科上 CSS 的描述 http en wikipedia org wiki Cascading Style Sheets ht
  • jQuery animate() 和 CSS calc()

    我尝试设置CSScalc 使用 jQuery 动画 例如 element animate height calc 100 30px 500 我注意到calc 不支持 jQuery 动画 我希望有一种方法可以做到这一点 我不想要类似的方法 替
  • jquery覆盖加载栏div

    所以我有一个数据表 并且我正在使用 ajax 获取数据 当检索数据时 表中的数据消失并出现一个小的加载圆圈 我希望数据保留 我知道如何做到这一点 并且加载圆圈出现在表格的中心 不一定是垂直的 至少是水平的 以及稍微透明的背景阻挡稍微超出表格
  • 多列定义列表[重复]

    这个问题在这里已经有答案了 我有一个 dl 像这样 dl dt Quantity dd dt Size dd dt Rise dd dt Color dd dd dt dd dt dd dt dd dt dl 该列表是通过 php 动态生成
  • 如何观察包含许多 sass 文件的整个目录/文件夹的变化

    我如何跟踪包含许多 sass 文件的整个目录的更改 我正在使用以下命令来观察 sass 的变化 file sass watch style scss style css 但是如何观察包含许多 sass 文件的整个目录 文件夹的变化 只需使用
  • 在导航栏下方添加背景图片

    我想在导航栏下方添加背景图像 具有完整窗口大小的宽度 它不应覆盖整个页面长度 而是从导航栏菜单下方开始 一直向下直到特定的指定高度 但宽度是满的 我参考了以下内容 但仍然没有结果 在 Twitter Bootstrap 中的导航栏下方启动背
  • 如何仅使用CSS设置某个角的边框半径

    如上所示 我可以只给顶部部分而不给底部提供半径 或者有时给底部而不是顶部提供半径吗 有没有办法只给一个角提供边界半径 Like border radius top left top right bottom right bottom lef
  • 如何使用CSS将背景图像放入选择选项标签中

    我有一个从 json 响应接收的国家 地区下拉列表 并且想要在国家 地区名称旁边添加相应的国家 地区国旗图标 也从 json 响应获取图像 我已经尝试了不同的 jQuery 和 bootstrap 插件 但他们所做的是破坏我以前的选择框样式

随机推荐

  • PostgreSQL:如何实现最小基数?

    正如这个问题中的回答 PostgreSQL 中的基数 https stackoverflow com questions 3135206 cardinality in postgresql 基数是使用强制执行的限制条件 http www p
  • 使用游标获取字段值

    我正在创建一个应用程序 但遇到问题Cursor 我有一个SQLiteDatabase这给我返回了一个Cursor当我尝试使用此函数获取值时 public Cursor fetchOption long rowId throws SQLExc
  • 如何将“zd”说明符与“printf()”一起使用?

    寻求有关使用的说明 zd with printf 当然 对于 C99 及更高版本 以下内容是正确的 void print size size t sz printf zu n sz C 规范seems允许printf zd n sz 取决于
  • 如何正确对齐此文本?

    我今天写了这个极地时钟 我几乎完成了 除了我想在行内对齐我的文本 类似于this http blog pixelbreaker com polarclock 有谁知道如何做到这一点 我尝试使用 FontRenderContext 和字体指标
  • Android HttpClient 性能

    我正在开发 Android 应用程序 它使用大量对 Web 服务的 http 请求 起初 我在每个请求之前创建一个新的 HttpClient 实例 为了提高性能 我尝试在多个线程中执行请求 因此 我使用 ThreadSafeConnecti
  • 带有 c:foreach jstl 标签的二维数组列表

    我在两个叠瓦式 JSTL 中使用二维数组列表
  • 计算多个 CSV 文件中一列的平均值

    我的文件夹中有 300 多个 CSV 文件 名为 001 csv 002 csv 等 每个包含一个带有标题的数据帧 我正在编写一个函数 该函数将采用三个参数 文件的位置 要计算平均值的列的名称 数据框内 以及计算中使用的文件 这是我的功能
  • 如何在 Eclipse 中调试在 jetty 上运行的 Web 应用程序?

    以前从未做过网络编程 有没有办法设置断点 在 Eclipse 中查看变量值 我想要调试的应用程序会生成一个我想轻松提取的查询字符串 单击外部工具配置 Select program and click the new button top l
  • 无法将 React.lazy 与 Material UI 图标一起使用

    因为我的应用程序中的很多地方都有很多图标 所以我想对它们使用代码分割 我创建了辅助组件来执行此操作 import React FunctionComponent Suspense from react interface LazyMuiIc
  • 在哪里可以找到 Google Compute Engine 的名称服务器?

    我已将一个网站上传到我的 Compute Engine 实例 并且我想设置注册器以将访问者发送到服务器 Compute Engine 在哪里可以通过 Compute Engine 获取实例 服务器的名称服务器 Google Compute
  • 使用 alex/happy 与 Cabal

    我正在为我正在学习的课程编写一个编译器 该类不是专门的 Haskell 但我使用 Haskell 来编写我的编译器和解释器 我有一个 cabal 包设置 希望能让我的教授轻松运行 编译 我有快乐和亚历克斯在build tools两个可执行文
  • node.js - 配置节点将函数加载到全局范围内?

    在现实生活中 我在某个地方看到我们可以配置 Node js 在全局范围内执行加载的模块 但我现在找不到如何做到这一点 我为什么要问 我有一些遗留文件定义了我想在服务器和客户端上使用的语言实用程序 但是其中许多实用程序被定义为全局范围函数 例
  • 设计确认在首次发送时无效

    我有一个 Rails 4 应用程序 使用 Devise 3 2 2 confirmable 并且遇到了发送无效确认令牌的问题 但是只是第一次 重新发送确认令牌后 链接将起作用 相关路线 devise for users skip sessi
  • 设置信用卡号格式

    如何在输入时格式化和验证信用卡号 每 4 位数字之间留有空格 eg 4464 6846 4354 3564 我努力了 creditno keyup function cc this val split join cc cc match ne
  • 使用 SwiftUI 的relativeWidth 仅适用于框架视图

    尝试在 SwiftUI 中构建一个条形图元素 其宽度根据元素的值与其父视图成比例 这是问题的简化版本 struct BarView View var body some View Color purple relativeWidth 0 5
  • 在 DB2 中显示表的定义

    大家好 我正在学习DB2 想知道如何 创建表后查看表的特征 类似于MySQL中的EXPLAIN TABLE命令 谢谢 此外DESCRIBE TABLE 您可以使用下面的命令 DESCRIBE INDEXES FOR TABLE tablen
  • 发送多个 HTTP 请求

    我需要编写使用项目 ID 查找有关项目的信息的程序 该 API 一次仅获取一项 因此我只能对每项执行一次查询 API 仅限于五个同时请求 任何额外的结果都会给出 HTTP 429 错误 如果有一个 JavaScript 对象 其中包含所有带
  • WordPress:重置密码始终无效密钥

    我有一个很大的问题 找不到解决方案 我已经安装了 Ultimate Member Plugin 并激活了它 当我现在重置用户的密码时 我会从我的页面收到一封电子邮件 其中包含在class password phpUM函数调用触发的插件文件u
  • ember.js 中是否有一个回调,我可以在状态转换后渲染所有视图后使用它来运行代码?

    我有由三个出口组成的应用程序视图 提出自己的观点 简化
  • 为什么 CSS :not 伪类不能按预期工作?

    考虑以下 HTML div class a div class b Hello div div div class c div class b World div div 按照预期添加以下 CSS 颜色 仅 世界 为红色 c b color