我有一个联系网页，在其中我有div一些css应用到特定的div使用它的id，我想使用这种样式div来添加更多的s，但只有body. 但是我有一个标题div，我在这个网站上的所有页面上都使用它，我不希望这种样式应用于它或其子项。
我如何css :not()在#header div 和它的孩子上使用选择器？
我有一个脚本（此处为 JsFiddle），可以检测li块元素何时在页面上垂直居中，并为其分配一个.centered类以通过 CSS 使其更大。
.centered {
height: 30vh;
background-color: #bbb;
-webkit-transition: height 0.6s;
}
一旦确定了中心元素，我就可以通过以下方式选择下一个兄弟元素：
.centered + li {
height: 20vh;
background-color: #ccc;
-webkit-transition: height 0.6s;
}
当我尝试在纯 CSS 中选择 .centered 元素之前的同级元素时，就会出现问题
在查看2011 年的这个问题后，我尝试使用评论和其他选择器之一中建议的 :has() 伪类，但没有运气。
这个CSS4关系伪类可以做到这一点，但目前不支持：
li:has(+ .centered) {
height: 20vh;
background-color: #Fcc;
-webkit-transition: height 0.6s;
}
我还尝试选择不是 的同级元素的last-of-type，但要么只支持简单的选择器，要么我只是不知道如何正确链接选择器。li.centered:not()
这是不工作的选择器：
li:not(.centered ~ li):last-of-type {
height: 20vh;
background-color: #Fcc;
-webkit-transition: height 0.6s;
}
问题：是否有任何伪类和选择器的组合可以在纯 CSS 中实现这一目的？
我希望自提出这些问题以来已经取得了一些进展。
如果浏览器不支持 CSS 伪类（例如 ），会发生什么情况:dir？
例如：
html:dir(rtl) {
color: red;
}
如果浏览器不理解:dir伪类，他们会忽略这条规则吗？我对一般情况比对这个特定的伪类更感兴趣。我的直觉告诉我是的，但我还没有找到证实我直觉的文档。
这个问题与这个问题不同：无效的 CSS 选择器导致规则被删除：原理是什么？。它的范围更窄，我问的是浏览器在看到它无法识别的伪类时会做什么，而不是一般情况下它对无效的 CSS 选择器会做什么。据我所知，例如，无法识别的伪类仍可能被视为有效的选择器。
我正在使用 css 技巧响应表（https://css-tricks.com/responsive-data-tables/），但想知道如何摆脱移动视图的最后一个 td “之前” 内容。
基本上对于这段代码，它在响应视图的 td 中写入文本：
table td:nth-of-type(1)::before { content: "Expenses"; }
table td:nth-of-type(2)::before { content: "2015"; }
table td:nth-of-type(3)::before { content: "2016"; }
对于第一行（在单元格中写入“费用”），除了最后一个单元格之外，我如何让所有发生这种情况？发生的事情是我的最后一个是该表的“总计”行，所以我不需要将“td 内容之前”写入最后一个 td（如果这有任何意义......我也想知道我的表格格式需要调整，或者我只需要以不同的方式处理“总计”行以及这些响应式表格——对于带有“总计”行的响应式表格，没有明确的 CSS 技巧示例）。
我一直在尝试 last-child、nth-last-of-type 等，但没有运气。这是我尝试过的一个例子：
table td:nth-last-of-type(1)::before { content: " "; }
但是，它不起作用。我读过你可以组合伪元素和伪类......我尝试过与 :not also, display: none 的组合，并尝试更改 HTML，但没有运气。甚至可能用 jQuery 写一个 display none 到最后一个 td 并添加一个类然后显示 none？我在这个圈子里跑。
谁能帮我？
谢谢！
更新：这是一个 JSFiddle，显示了这一点：https ://jsfiddle.net/gamehendgeVA/vh7bjscy/
我正在制作一个自定义元素，并且一直在寻找一种向:host与 shadow DOM 关联的伪类添加更多特异性的方法。根据我的理解，它用于选择实际的自定义元素本身。例如，如果我有一个被调用的元素my-elem附加了一个 shadow DOM，那么:host伪类就相当于my-elem全局样式表中的一个类。
从这个我想尝试，并进一步明确的选择，这样我可以风格在他们的状态自定义元素，例如：:host:not(.active)。但是，我真的找不到任何关于进一步具体的阅读，:host并且使用上述内容不起作用。
我也尝试过传统的:host.active，甚至是厚脸皮的，:host[active]但都没有奏效。
所以我想问一下这是否可能。我已经在网上进行了一些搜索，但网上似乎并没有太多关于此事的信息，我觉得这可能是不可能的，所以我可能不得不降级并将活动类应用于包装器状态更改时的自定义元素。
我只是想这样做，因为它允许我以编程方式从其父元素设置元素的样式（我将活动/非活动样式应用于自定义元素表单的自定义幻灯片）。
先感谢您。
我理解如何更改活动<li>元素的描述
li:active {
...declarations...
}
但是,如何更改所有其他不活动的元素？
例如,我的所有元素都是粗体,但是当我选择其中一个元素时,所有其他元素都会恢复正常.
谢谢!
我无法弄清楚如何将奇数/偶数:nth-child()伪类应用于定义列表
<dl>
<dt>green foo</dt>
<dd>green bar</dd>
<dt>red foo</dt>
<dd>red bar</dd>
<dt>green foo</dt>
<dd>green bar</dd>
</dl>
<style>
dl { color: blue }
dd:nth-child(odd) { color:green }
dd:nth-child(even) { color:red }?
</style>
新小提琴:
使用正确的:nth-of-type伪类.
dd:nth-of-type(even) {color: red;}
dt:nth-of-type(even) {color: red;}
dd:nth-of-type(odd) {color: green;}
dt:nth-of-type(odd) {color: green;}
我环顾四周,当表格聚焦时,我无法找到制作标题的解决方案.我可能错过了一些明显的东西(可能是这个选择器无法完成).
理想情况下,我想避免使用jQuery并坚持使用CSS(更高级的CSS很好)因为我没有计划支持IE - 我喜欢学习,但IE对我来说太痛苦了.
这是我目前的CSS:
#search-title {
color: rgba(0, 0, 0, 0);
font-size: 20px;
font-weight: 300;
margin-left: -30px;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-ms-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
}
input[type="text"]:focus #search-title {
color: #F70;
margin-left: 35px;
}
提前致谢,
山姆
我正在为我的按钮使用a:focus伪类(按下时).它在Firefox上工作正常,但它不会改变它在Chrome中的状态.有没有解决方法？
CSS:
.btn:focus {
box-shadow: 1px 1px 1px #586601 inset;
text-shadow: -1px -1px 1px #000000;
}
(这是一个带有"btn"类的输入标签.)
笔记本电脑上的大多数触控板都具有“点击即可点击”选项/功能，轻按即被识别为按下（按下触控板按钮之一或在无按钮触控板上按下触控板表面）并触发点击。我在Macbook Pro上注意到，:active如果我点击触控板，则CSS 样式不会应用于HTML元素。仅当我在触控板上按住约1秒钟时才应用它们。
有没有一种方法可以使触控板点击（而非移动触摸屏点击）触发:active状态？