Question

我有一个字符串数组。

$x=array('blabla1', 'blabla2', ...);

我希望使用div中的字符串填充$x块，直到我的div已满。我div的高度固定为$h。

例如，我想把div这样的东西放进去

<div>
     <ul>
           <li> 'blabla1' </li>
           <li> 'blabla2' </li>
           <li> 'blabla3' </li>
           ...
      </ul>
</div>

直到它满了。

有什么猜测怎么办？ Javascript还是php？谢谢:)）

为什么我要这样做：我的网页上有一个带有建议链接的div div。我想在这个div中添加尽可能多的建议链接。

可乐

PS：随意编辑我的帖子（例如，添加标签）。

Answer 1

因为您已经知道div的固定高度值。您还可以为li元素添加固定高度值，然后从php执行以下操作：我假设您已经在css中设置了div和ul的固定高度值。

    $div_height = 500px;
    $li_height = 21px;


    echo '<div id="mydiv"><ul id="myul">';

    for($i=0;$i<=$div_height;$i+=$li_height){
       echo "<li>"."your content here"."</li>";
    }

echo '</ul></div>';

Answer 2

仅使用php就可以解决这个问题。

我的建议是使用溢出隐藏的css属性和jquery插件这样做：

dotdotdot

Answer 3

您必须在任何固定的可测量单位（例如px）中确定div的高度。然后调整每个列表项的高度。通过除以div的高度/列表项的高度，您将知道所需的列表项的数量，所以在div中执行以下操作：

<div class="define-height">
<ul>
<?php
for ($i = 0; $i < $n; $i++){
?>
<li><?php echo $x[$i];?></li>
<?php } ?>
<ul>
</div>

Answer 4

使用jQuery客户端：

while( $("#divId").height() > $("#ulId").height() ) {
    $("#ulId").append("<li>blabla1</li>");
}

Answer 5

来自评论：

你不能只使用溢出的任何原因：隐藏？ - Marc B
然后你必须通过javascript。从javascript是你创建后可以拥有dom元素高度的唯一方法。也许这个div必须通过对php返回一个li元素的ajax调用来动态填充。然后在javascript中计算是否有足够的空间来安排li元素在这种情况下进行下一次调用，直到没有更多的可用空间。您还可以在div中设置overflow：hidden，但这只会隐藏div之外的内容。 - slash28cu

填充容器（div）直到它满了

5 个答案: