html - css flexbox 包装 : analogue of pseudo-classes to select start/end items on main/cross axis?

Question

Flexbox 是个好东西。但是为了更通用，当使用 flex wrapping 时:它需要伪类，类似于 first-child 或 last-child 或 nth-child。

如果元素位于主轴的末尾，或者它被包裹并且现在位于主轴的开头，这将是非常舒适的。

例如，我想要这个:

.flexbox
{
    display: flex;
    flex-flow:row wrap;
}

.flexbox .item:flex-start
{
    /*items in the left of container selector*/
}

.flexbox .item:flex-end
{
    /*items in the right of container selector*/
}

.flexbox .item:flex-cross-start
{
    /*items on the top of container selector*/
}
.flexbox .item:flex-cross-end
{
    /*items on the bottom of container selector*/
}

但是很遗憾 - 没有 pseudo classes有一个灵活的主题。

问题:我可以写 css 选择器(没有 JS)，确定 wrap-flex-container 中位于主轴/横轴开始/结束的元素吗？

子问题:为什么flexbox没有伪类，是不是有些概念上的矛盾？

Answer 1

不幸的是，目前，您无法在 CSS 中确定您的 flex 元素在包装时是否开始新的行/列。