Question

有几个具有内联表或内联块显示样式的div。

根据窗口宽度，每行的div数将改变。

分辨率越高，每行的div越多。

是否可以仅在元素相互接触的地方显示边框？

第n个选择器可以删除最后一个元素的右边框，但据我所知，并不是每行上出现的最后一个元素。

此外，是否可以仅在最后一行上的元素上删除border-bottom？

我没有按行寻找具有固定数量元素的解决方案。我正在寻找一种解决方案，该解决方案适用于具有动态行数元素的布局。

Answer 1

尝试在每个div上给出max-width作为百分比，并为不同的屏幕大小写相同的第n个样式，在那里你看到div被包装，我的意思是每次添加/删除div时对不同分辨率的媒体查询。

Answer 2

如果它对任何人有帮助，这里使用的解决方案是有一个带溢出的容器：隐藏，隐藏第一行和第一列上元素的顶部和左边距。

.thumb { display: inline-table; margin-top: -1px; margin-left: -1px; width: 170px; height: 170px; border: 1px solid #EEE; border-width: 1px 0 0 1px; }

<div class="col" style="padding-left:0; overflow:hidden;">
<div class="thumb"></div>
<div class="thumb"></div>
<div class="thumb"></div>
etc
</div>

仅在相邻元素上使用css边框

2 个答案: