在原子编辑器中设置交替线的样式

Question

我正在查看原子编辑器设置并认为我会做一个简单的更改，以显示交替线条的不同颜色，这样我就能看到线条包裹时发生了什么。

看起来编辑器不按顺序显示行：

正如你在第26行看到的那样，我试图让每条偶数行都有不同的背景颜色，但第12,13和14行都会突出显示。

查看开发人员工具（Mac上的Command-option-i）会显示这些行在文档中按顺序存储，因此它们会交替显示，但这并不是它们在屏幕上突出显示的方式。

是否有办法始终如一地突出交替线条？

修改

我也尝试将样式添加到行号：

.editor .line[data-screen-row]:nth-child(2n) {
  background-color:red;
}

这似乎也有问题，我也注意到当换行时会给它们一个新的行号。

Answer 1

我并不认为您所要求的是Atom目前架构的方式。根据我的理解，这些行在插入/修改时以最合适的顺序放置在DOM中，然后使用绝对定位定位在屏幕上，如每个style属性中所示div 1}}。

Answer 2

这可能不是最漂亮的解决方案，但可以帮到你：

atom-text-editor::shadow .line[data-screen-row$="0"],
atom-text-editor::shadow .line[data-screen-row$="2"],
atom-text-editor::shadow .line[data-screen-row$="4"],
atom-text-editor::shadow .line[data-screen-row$="6"],
atom-text-editor::shadow .line[data-screen-row$="8"] {
  background-color: #292929;
}