我想要的效果：
我正在使用foreach循环来显示此容器元素中的div.快速和肮脏的是做索引％4(或者每行的div数是多少)和相应的样式,但是如果有的话,我正在寻找一种仅用于css的方法.
我现在正在玩的一件事是将白色边框应用于具有负边距的容器元素,以掩盖外部div的边界……还有其他替代方案吗？
编辑：我正在尝试“容器周围的白色边框”方法,但它没有工作,因为我浮动divs左(为响应性) – 所以只要容器元素的白色边框重叠黑色边框div,div被推到下一行.
所以,首先,css.你肯定是在正确的轨道上,外边框覆盖div的边界.我调整了你的方法一点点.我没有将该边框放在父元素上,而是创建了一个额外的子元素(在这种情况下是一个跨度),并将其绝对定位在父元素内,以跨越整个宽度和高度.我把边框放在它上面而不是父边框上,因为它是绝对定位的,所以它不会干扰其他元素的定位.
另外,Box-sizing：border-Box;如果您遇到边界破坏布局的麻烦,可能会派上用场.我在我的例子中使用了它.
以下是该方法的演示：
至于第二种解决方案,我使用了一些更高级的选择器来覆盖某些盒子上的某些边框.这样,它们不仅仅是隐藏的……它们实际上并不存在.出于这个原因,我宁愿在第一个使用这个解决方案,但这只是我的意见.
首先,我在所有div上放置了右边界和边界底边.这对于除了每行的最后一行以及底行中的所有div之外的所有div都是正确的.
要选择每行中的最后一个div来取消它的右侧边框,我可以这样做：
.container div:nth-child(Xn) {
border-right: none;
}
其中’X’将替换为每行中div的数量.如果我使用嵌入式样式执行此操作,我可以使用PHP动态地将该数字放在那里.
要选择和停用最后一行的底部边框,我可以这样做：
.container div:nth-child(X) ~ div {
border-bottom: none;
}
同样,’X’将与PHP一起放置,并且将等于每行中div的数量,乘以行数减去1.所以基本上,选择在倒数第二行的最后一个div之后的所有div.
这是演示的小提琴,减去它的PHP方面(我手动将数字输入到css中)
无论你决定坚持使用css方法,还是尝试添加一些小软件,我希望这对你有帮助.祝你好运！
更新：作为事后的想法,我应该添加第三种解决方案.如果你能够添加包围div的行元素,你可以利用：first-child和：last-child来禁用你的边界.
我认为这是相当不言自明的,所以只需看看代码：
