当前位置: 首页 > 面试题库 >

在CSS中将:last-child与:not(.class)选择器组合

孔和畅
2023-03-14
问题内容

是否可以选择最后一个没有课程属性的孩子?像这样:

<tr> ... </tr>
<tr> ... </tr>
<tr> ... </tr>
<tr class="table_vert_controls"> ... </tr>

在这种情况下,我想选择第三行。

我尝试了以下操作,但无效:

tr:not(.table_vert_controls):last-child

提前致谢。


问题答案:

不单单是CSS选择器,也不是,就像:last-child专门针对 最后一个child一样 ,并且没有类似的:last-of- class伪类。请参阅我对这个相关问题的回答。

截至2015年底,对于选择器4的扩展,实现已开始慢慢进行:nth-child():nth-last- child()并允许您将任意选择器作为参数传递(有关更多信息,请参见链接答案的更新)。然后,您将能够编写以下内容:

tr:nth-last-child(1 of :not(.table_vert_controls))

尽管最近已经开始实现该实现,但要获得广泛的支持还需要至少几年的时间(截至2018年4月,即第一个发布的浏览器两年半之后,Safari仍然是唯一拥有此功能的浏览器。这样做)。同时,您还必须使用其他方法,例如在所讨论的类之前的其他类或jQuery选择器:

$('tr:not(.table_vert_controls):last')


 类似资料:
  • 问题内容: 我正在尝试选择a内的所有元素,但第三个和第四个除外。我设法做到了: 我想合并这些选择器,因为我还有其他条目。像这样的东西,但是没有用: 这 确实 适用于jQuery,但不适用于CSS。我正在使用Chrome(并且我只需要在其中使用它即可)。 我无法找到这种情况的组合选择器。如何将选择器与结合使用? 问题答案: 选择器级别3仅允许伪类中的单个简单选择器使用。作为jQuery选择器,它之所

  • 问题内容: 我有一个元素列表,其样式如下: 输出代替 有谁知道如何使用CSS选择除最后一个元素以外的所有元素? 您可以在此处查看选择器的定义 问题答案: 如果不是选择器有问题,则可以设置所有选择器并覆盖最后一个选择器 或者如果您可以使用之前,则不需要最后一个孩子

  • 问题内容: test1 test2 test3 test4 如何选择班级名称为“ 名单的 最后一个孩子” ? 我知道上面的示例不起作用,但是有什么类似的方法可以起作用吗? 重要: a)我不能使用,因为它可能也排在第四或第五位。 b)没有JavaScript。 问题答案: 我建议您利用可以为一个元素分配多个类这样的事实: 最后一个元素具有与其兄弟姐妹相似的类,但也具有可用于设置所需的任何CSS属性的

  • id 和 class 选择器 如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器。 id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。 HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。 以下的样式规则应用于元素属性 id="para1": #para1 { text-align:cente

  • 问题内容: 我在使用这个特定的CSS选择器时遇到了麻烦,当我添加它时,它不希望工作。似乎可以与其他选择器的任何组合正常工作: 如果我删除了该部件,它就可以正常工作。即使我将选择器更改为它,也不会选择输入了文本的输入字段。这是坏了还是我只是不允许在选择器中使用? 我唯一想到的是浏览器仍在说该元素为空,因为它没有子元素,每个元素只有一个“值”。选择器是否没有针对输入元素和常规元素的单独功能?但这似乎不

  • 问题内容: 根据介绍,我们可以在jQuery中使用大量CSS选择器,但此处未提及。但是,当我测试以下内容(使用Google的jQuery1.7.1)时,它实际上可以在Firefox,Chrome和IE 9上运行,但不能在IE 8仿真模式下的IE 9上运行: 那是怎么回事?好像jQuery生成了CSS代码一样,并且以某种方式注入了它,然后在支持所用选择器的浏览器上可以正常工作。但这很奇怪。 最重要的