如何使该循环一次，然后中断然后继续循环？

Question

我用float：left在div中水平循环，它按应有的方式工作，但是问题是每个div都有一个唯一的高度，该高度受其中包含的内容的影响，因此当调整浏览器大小时，结果可能看起来很混乱。 我希望php循环一次，中断，然后开始新的一行，以便无论浏览器的大小如何，它看起来都一样。

如果还不是很明显，那么我对php并不满意，并且努力拼凑我所拥有的东西。

<?php
$url = "XML.php";
$xml = simplexml_load_file($url);
$namespaces = $xml->getNamespaces(true); // get namespaces
for($i = 0; $i < 10; $i++){

    $poster = $xml->channel->item[$i]->children($namespaces['x'])->poster;
    $html .= "<div class='wrapper' style='float:left;'>$poster</div>";}

echo $html;
?>

Answer 1

如果我了解您想要的信息，这里就是我的建议：

您的循环很好。 因此，可以说您希望它看起来没有页面大小一样。 例如：您希望每行5格。 您可以使用CSS来做。

您总共有10格，因此您需要2行。

添加到您的循环：

if($i = 5){
$html .= "<div class='wrapper' style='float:left;clear:right;'>$poster</div>";}
}
else{
$html .= "<div class='wrapper' style='float:left'>$poster</div>";}
}

这是非常基本的， clear:right; CSS语句将阻止其他任何div进入第五个div的右侧，因此它将开始新的一行；

您可能应该添加display:inline-block; 以及您的CSS。

如果这没有按照您想要的方式工作，则另一个选择是使用相同的if条件使div中的每一行

为例：

html.= '<div class="row">'; // start the row here
 if($i = 5){
 // You might want to use another increment to keep track of the row
 //  because in this case you would only make 2 rows.
    $html .= '</div><div class="row">'; // end the first row and start a new one
    }
    else{
    // we do nothing
    }
html.= '</div>'; //end the row here

您可能希望使用第二个增量，该增量增加5，所以可以在垫子上加上一些类似的东西

之后，您只需要调整CSS行类。