css - 如何在某种图片库中对齐 ul 中包含的图像

Question

我有一个对称的网格。我已将我的输出类型设置为 float 6 列。我的目标是显示无序列表中的列表项，在本例中为图像，显示在某种图片库 ( gist ) 中。

移动布局:所有图像 100% 宽度垂直对齐。

bp500px:每张图片有 3 列宽 - 效果很好。

bp750px:每张图片有 2 列宽 - 布局中断。

float-span 是否不适用于列表中的第二项 - 但基本上 float-span(2) 是为每个元素编号 1 和 2 设置的，而 float-span(2,last) 是为每个第三项设置的？

或者 $output: float 和 float-span 的组合是否已经是对称网格环境中那种目标的错误选择？最好使用隔离混音？

最好的问候拉尔夫

Answer 1

如果有与之关联的代码，这将更容易调试，但大概对于您的 bp500px 您有类似 li:nth-of-type(even) 的东西对于 last .这比简单的 li 具有更高的选择器权重，并且由于媒体查询的选择器权重低于伪选择器，因此您需要执行以下操作之一:

• 撤消:nth-of-type(even) bp750px 中的选择器通过用你想要的跨度重新调用它_ 围栏 bp500px 以便代替 (min-width: 500px)你用(min-width: 500px) and (max-width: 749px)