CSS:设置具有特定跨度的特定段落的样式

CSS:设置具有特定跨度的特定段落的样式,css,css-selectors,Css,Css Selectors,可能重复: 我试图用一个“长句”类来设计一个段落,其中包含一个“背景填充”类的跨度。样式的目标必须是段落,而不是跨度 因此,该解决方案不合适,因为它针对的是跨度: p.long-sentence span[class="background-fill"] 此选择器看起来很完美,但它针对的是具有“背景填充”属性的范围,而不是类: p.long-sentence[span="background-fill"] 能做到吗?或者对于具有多个变量的选择器来说,这是一个过于严格的标准吗?这需要使用CS

可能重复:

我试图用一个“长句”类来设计一个段落,其中包含一个“背景填充”类的跨度。样式的目标必须是段落,而不是跨度

因此,该解决方案不合适,因为它针对的是跨度:

p.long-sentence span[class="background-fill"]
此选择器看起来很完美,但它针对的是具有“背景填充”属性的范围,而不是类:

p.long-sentence[span="background-fill"]

能做到吗?或者对于具有多个变量的选择器来说,这是一个过于严格的标准吗?

这需要使用CSS选择器4

例如,以下选择器表示一个列表项 有序列表的子对象:

OL>LI:独生子女

但是,下面的一个表示具有 唯一的子项,该子项为LI:

$OL>LI:独生子女

这两个选择器表示的结构相同,但 选择器的主题不是

表格:

但是现在没有浏览器支持CSS选择器4。所以你需要使用JavaScript

jQuery:

$("p.long-sentence:has(span.background-fill)").addClass("otherClass");

所以说得很清楚,您想更改
span.background fill
的父元素的样式吗?我认为没有javascript是无法做到的。你试图有条件地设计父对象的样式这一事实对我来说很奇怪。如果您正在动态生成此标记,那么为父段落提供一个附加类以便您可以对其进行样式设置就很简单了。请检查以下问题:老实说,这更类似于,但这也是与此关闭所针对的同一问题的重复。伙计,所有的路都会通向JQuery:)是的,在回答jblasco时,我想设计跨度的父元素。我来看看另一个问题。请不要告诉我这需要JS!我宁愿在CSS中使用变通方法。感谢您提出CSS4的想法,这似乎是一个优雅的解决方案。我想到了一个CSS解决方案:将样式从“span.background fill”移动到一个新的(备用)选择器“p.long-sense>span”,那么这个(父)选择器应该能够以“p.long-sense[span]为目标,因为span现在没有类(或ID).但是…我的解决方法只适用于p.long-session只包含背景填充的span,而不包含其他span。
E[foo]
表示带有“foo”属性的E元素。建议CSS4选择器之前,最好先等待一段时间(阅读:一年或两年)让事情稳定下来。从2012年起,主题选择器现在由!表示!。我不知道什么时候会再次发生变化。