gpt4 book ai didi

html - :last-of-type doesn't work

转载 作者:太空狗 更新时间:2023-10-29 13:11:02 24 4
gpt4 key购买 nike

Example GIF

我有一个带有缩写 HTML 内容的 HTML 文档:

<div class="list">
<form name="signupForm">
<label class="item item-input">
<input>
</label>
<label class="item item-input">
<input>
</label>
<label class="item item-input">
<input>
</label>
<label class="item item-input">
<input>
</label>
<label class="item item-button">
<input class="button button-block button-positive">
</label>
<label class="item item-button">
<input class="button button-block button-signup">
</label>
</form>
</div>

我预期的行为是 CSS 选择器 .item.item-input:last-of-type 将获取第 4 个 label 元素和最后一个 form 父项的 item.item-input 元素。

我做错了什么?

最佳答案

:last-of-type 匹配一个元素,该元素是其(第一级)父句点中其类型(标记)的最后一个元素。它不知道也不关心您可能组合了哪些其他选择器,包括类选择器,例如 .item-input 或其他任何东西。

在 CSS 中没有直接的方法来完成你想要的,可以表示为 :last-of-selector。已建议的一些替代方案包括

  1. 将前四个元素包装在一个单独的 div 中,这样您就可以在其中执行 :last-of-type

  2. 让某人(服务器、本地 JS)用特定类标记您想要的元素,然后引用它。

  3. 其他 hack,例如在末尾硬连接要跳过的额外元素的数量,并使用 :nth-last-of-type

  4. 给有问题的元素一个不同的标签,如果你能做到的话,然后你就可以使用last-of-type

关于html - :last-of-type doesn't work,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29859388/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com