视觉(块重排)行的第一个元素的CSS选择器 [英] CSS selector for first element of visual (block reflow) row

问题描述

每个可视行的块项的第一个元素是否都有CSS选择器? 也就是说，假设有20个块元素，以便它们跨多行流动以适合其父容器.我可以选择每行的最左边的项目吗?

Is there a CSS selector for the first element of every visual row of block items? That is, imagine having 20 block elements such that they flow across multiple lines to fit in their parent container; can I select the leftmost item of each row?

通过查看所有元素的顶部位置在JavaScript中是可行的，但是在纯CSS中有可能吗?

It's doable in JavaScript by looking at the top position of all of the elements, but is it possible in plain CSS?

推荐答案

是的，可以通过CSS来实现，但前提是您可以固定每一行中的元素.

Yes, Its possible through CSS but only if you can fix the elements in every row.

由于您没有提供案例，这里是一个示例.

假设您的元素以ul和li模式堆叠，并且是连续三个列表，则可以使用以下CSS片段.

Suppose, your elements are stacked up in a ul and li pattern and are three lists in a row, then you can use the following css snippet.

li:first-child, li:nth-child(3n+1) {
    background: red;
}

这篇关于视觉(块重排)行的第一个元素的CSS选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！