Question

我正在尝试使用bootstrap 3和一个简单的php脚本创建一个简单的响应式库，以显示特定目录中的所有图像，以响应此处的另一个问题。

我遇到的问题是回复所需的<li></li>代码，而不是<br></br>，如下所示。

这里是我当前如何在<li></li>标签内显示图像，其中包含一个类，用于显示<ul></ul>标签中调用的图像布局/定位。

<div class="container">
          <ul class="row">
            <li class="col-lg-2 col-md-2 col-sm-3 col-xs-4">
                <img class="img-responsive" src="images/kitchens.jpg">
            </li>
            <li class="col-lg-2 col-md-2 col-sm-3 col-xs-4">
                <img class="img-responsive" src="images/garden.jpg">
            </li>
            <li class="col-lg-2 col-md-2 col-sm-3 col-xs-4">
                <img class="img-responsive" src="images/front.jpg">
            </li>
          </ul>
</div> <!-- /container -->

这是PHP我在回答https://stackoverflow.com/a/19255786/3599850

中发现的问题时使用的

<?php
$files = glob("images/*.*");

for ($i=0; $i<count($files); $i++) {
    $image = $files[$i];
    print $image ."<br />";
    echo             

    '<img src="'.$image .'" alt="Random image" />'."<br /><br />";
}

?>

这是我的尝试：（

<?php
$files = glob("images/*.*");

for ($i=0; $i<count($files); $i++) {
    $image = $files[$i];
    print $image ."<br />";
    echo

    '<li class="col-lg-2 col-md-2 col-sm-3 col-xs-4">
    <img src="'.$image .'" alt="Random image" /></li>'."<li /><li />";
}

?>

Answer 1

您有太多关闭</li>代码：

<?php
$files = glob("images/*.*");

for ($i=0; $i<count($files); $i++) {
    $image = $files[$i];
    echo '<li class="col-lg-2 col-md-2 col-sm-3 col-xs-4"><img  class="img-responsive" src="'.$image .'" /></li>';
}

?>

您不需要print $image ."<br />";

简单的PHP，回显<li> ... </li>目录中的所有图像

1 个答案: