php - 在 n 号之后更改样式。结果- PHP

Question

您好，我使用 PHP 通过 while 循环从数据库中获取数据。已支付或未支付的类别通过数据库字段值应用。付费成员(member)每行显示 2 个成员，每行显示 3 个未付费成员，这对我来说效果很好。但一个小问题是，当付费成员(member)结束时，我想要一个换行符，然后从新的第 3 行连续显示未付费成员(member)。我该怎么做？

HTML

<div class="main paid">
  ABC
</div>
<div class="main paid">
  ABC
</div>
<div class="main paid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>
<div class="main unpaid">
  ABC
</div>

CSS

.main{
  float:left;
  margin-bottom:30px;
  border:1px solid #ddd;
}
.paid{
  width:49%;
}
.unpaid{
  width:32%;
}

工作 fiddle : https://jsfiddle.net/qzxyyo2x/1/

此处付费或未付费是从数据库中获取的表值。宽度应用于它们。我想在付费成员(member)结束时添加一个“换行符”，以从下一行开始连续显示未付费成员(member) 3。在这个问题中，我需要在 3 个结果后换行。如果付费成员(member)是 2、4、5、6 或其他。显示所有付费成员(member)后我需要换行。

提前致谢....

Answer 1

您可以使用一些 clearfix 代码来触发未付费类以 clear: both; 中断，但是如果应用于整个 .unpaid 类，所有未付费类都将打开他们自己的线路。

不正确的演示:https://jsfiddle.net/qzxyyo2x/2/

一个快速的解决方案是创建一个名为 .clearfix 的新类。只要 unpaid 类跟在 paid 类之后，你就可以使用它，但当 unpaid 类跟在 unpaid 之后时，你就不能使用它类(class)。此逻辑必须在 PHP 中完成。

正确的演示:https://jsfiddle.net/qzxyyo2x/3/

一个更优雅的解决方案是围绕每一行创建额外的 div，但这可能涉及更改更多的逻辑，而不仅仅是一个类。