javascript - 如何为每一行/行的最后一个元素设置不同的样式?

标签 javascript jquery css

我一直在尝试使用

创建网格
display:inline=block

我需要为每一行/行的最后一个元素设置不同的样式。我试过了

nth-child
nth-of-type

但是,当我使用它时,它会与我的其他网格混淆。那么如何在不添加新类的情况下做到这一点呢?

最佳答案

据我从您的代码中看到的,您不能使用 nth-child 来实现您的目标。我将尝试用一个例子来解释: 您希望 class="four"部分的第 4 个和第 8 个子元素为红色。为了使用 nth-child 或 nth-of-type,您必须从他们的 parent 开始引用 child ,即 body 。所以很难说body的 child 列表中的第4个和第8个section class="four"的 child 是多少,一点也不灵活。 我认为您以错误的方式使用它,例如 section.four:last-child,这是不正确的。请查收:w3schools link

此外,nth-child 和 nth-of-type 不能与选择器一起使用,而只能与元素一起使用,因此无法执行类似 .four:nth-child 的操作(如果您使用 class= “四个”在你的部分之外)。

因此,不添加更多类的唯一方法是 jquery,如下所示:

$('.four').last().css('background-color', 'red');

关于javascript - 如何为每一行/行的最后一个元素设置不同的样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19609036/

相关文章:

javascript - 如何通过 javascript 或 jQuery 删除 css rel

jquery - 无法更改 jquery fullcalendar 中的标题文本颜色

javascript - 如何克服多选问题

html - CSS:2个DIV,一个占用固定大小,另一个填满剩余空间

css - 如何访问文件上传按钮的属性?

javascript - 服务器关闭时触发事件 (NodeJS)

javascript - 创建一个只能从 Google Chrome 中的用户手势内部调用的函数

javascript - 使用纯函数创建组合函数

javascript - 一页上多个图表

Javascript:如何隐藏动态创建的div?