使用CSS创建列时，有什么方法可以选择行？

Question

我正在使用CSS将无序列表变成列，我想知道是否有什么办法可以选择“行”？

这是我正在使用的CSS：

ul.popular{
    margin:15px 0 30px;
    padding:0;
    list-style:none;
    -moz-columns:3;
    -webkit-columns:3;
    columns:3;
    -moz-column-gap:0;
    -webkit-column-gap:0;
    column-gap:0;
    list-style-position:inside;
    -moz-column-fill:balance;
    column-fill:balance;
    -webkit-column-break-inside:avoid;
    page-break-inside:avoid;
    break-inside:avoid;
    border-top:solid 1px #d2d3d4;
    border-left:solid 1px #d2d3d4
}
 ul.popular li{
    padding:10px 15px;
    border-bottom:solid 1px #d2d3d4;
    border-right:solid 1px #d2d3d4;
    display:block
}
 ul.popular li a{
    display:block
}

和HTML：

<ul class="popular">
    <li>Australia to Fiji</li>
    <li>Australia to Papua New Guinea</li>
    <li>Australia to Solomon Islands</li>
    <li>Australia to Tonga</li>
    <li>Australia to Vanuatu</li>
    <li>New Zealand to Fiji</li>
    <li>New Zealand to Papua New Guinea</li>
    <li>New Zealand to Solomon Islands</li>
    <li>New Zealand to Tonga</li>
    <li>New Zealand to Vanuatu</li>
    <li>United States of America to Fiji</li>
    <li>United States of America to Samoa</li>
    <li>United States of America to Tonga</li>
</ul>

提琴：

https://jsfiddle.net/cbkx1hLm/

我想知道是否有什么方法可以使每一秒钟的“行”具有不同的背景色。因此，每列的第二项。

我尝试使用nth-child（2n）和变量，也都是奇/偶，没有运气。

Answer 1

编辑：问题已经简化，现在是指选择“行”，并包括一个有效的示例。

但是当我们看一下给定的示例时：

实际上没有明显的行，“美国到斐济”项目分为两列，因此即使您想做到，该项目的第二部分也可能需要与第一部分不同的颜色。

更糟糕的是，根据窗口的宽度，字体大小等，其中的内容可能会发生巨大变化。

您似乎真正想要的是一张桌子。