【问题标题】:PHP is outputting table all on one linePHP在一行上输出表格
【发布时间】:2013-12-11 01:23:41
【问题描述】:

脚本应该获取文件夹中的所有图片并将前六张图片输出到表格中。然后我想添加一个小的下一步按钮,这样人们就可以查看其余的图像,但目前脚本只是将它们全部吐在一行上。所有这些,不仅仅是我想要的六个。除此之外,代码也出现在网页底部,在文档中的许多代码下方。

PHP

<?php

$i = 0;
$directory = 'images/gallery/';
$files1 = scandir($directory);
$x = 0;
$y = 0;
$z = 0; 
echo"<table><tr>";
foreach ($files1 as $filename) {
   if ($z == $x + 6) {
    break 2;
    }
    if ($x==1 || $x==0)
    {
        $x=$x+1;
    }
     else {
        if ($y == $x + 3) {
            echo "<td><a data-lightbox='gallery' href='images/gallery/$filename'><img src='images/gallery/$filename'></a></td></tr><tr>";
            $y = $x;
            $x=$x+1;
        } else {
            echo "<td><a data-lightbox='gallery' href='images/gallery/$filename'><img src='images/gallery/$filename'></a></td>";
            $x = $x+1;
        }
    }
}
?>

HTML

<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" >
    <title>Perspective by Daniel Streich</title>
    <link rel="stylesheet" type="text/css" href="scripts/css.css">
    <link href="css/lightbox.css" rel="stylesheet">
    <script src="js/jquery-1.10.2.min.js"></script>
    <script src="js/lightbox-2.6.min.js"></script>
    <link href="css/lightbox.css" rel="stylesheet" >
</head>
<body>

    <?php
    $active = "Art";
    include ('menu.php');
    ?>

    <div class="wrapperRegular">
        <p class="bigTitle">
            Perspective by Daniel
        </p>
        <p class='actualText'>
            TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST 
            TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST TEST 
        </p>
        <?php
        include ('gallery.php');
        ?>
        <br>
        <div id="footer">
            Copyright &#169; Perspective by Daniel
        </div>

    </div>
</body>

CSS

#wrapperRegular {
margin: auto;
width: 50%;
}
p.bigTitle {
font-family: 'alluraregular';
font-size: 500%;
text-align: center;
color: 898888;
line-height: .33em;
}
p.actualText {
font-family: 'alluraregular';
color: 898888;
font-size: 1.5em;
}

table {
font-family: 'alluraregular';
color: 898888;
font-size: 1.5em;
margin: auto;
text-align: center;
border:5px;
}

【问题讨论】:

  • 输出 html 是什么样的?
  • $z = 0$x 只会增加,因此您将永远无法通过$z == $x + 6 联系到您的break。似乎是一个非常复杂的循环,只回显 2 行,每行 3。只需使用一个不断增加的计数器并检查模运算符。

标签: php html css html-table word-wrap


【解决方案1】:

您没有关闭 PHP 中的 &lt;table&gt; 标记。这意味着&lt;p&gt;s 将进入表内部。大多数浏览器不同意这种无效的 HTML,将非表格元素放在表格的前面,这就是表格沉到底部的原因。

关闭你的 PHP 中的&lt;/table&gt;,它应该可以正常工作。

为什么不试试这个呢:

<?php

$directory = 'images/gallery/';
$files1 = scandir($directory);
$x = 1;
echo"<table><tr>";
foreach ($files1 as $filename) {
   if ($x <= 6) {
       if ($x % 3==0) {
           echo "</tr><tr>";
       }
       echo "<td><a data-lightbox='gallery' href='images/gallery/$filename'><img src='images/gallery/$filename'></a></td>";
       $y = $x;
       $x=$x+1;
   } else {
       break;
   }
}
echo"</tr></table>";
?>

【讨论】:

  • 如果 x > 6 也可以添加一个中断。
  • 是的,这就是问题所在,我必须跳过前两个元素,因为 scandir 会将前两个条目作为 .. 然后我有两张破碎的图片
【解决方案2】:

一种使行数为 3 的解决方案,跳过目录:

$count = 0;
echo "<table><tr>";
foreach ($files1 as $filename)
{
  if (is_file($filename))
  {
    if ($count && ($count % 3 === 0))
    {
      echo "</tr><tr>";
    }

    echo "<td><a data-lightbox='gallery' href='images/gallery/$filename'><img src='images/gallery/$filename'></a></td></tr><tr>";

    $count++
    if ($count >= 6)
    {
      break;
    }
  }
}
echo "</tr></table>";

【讨论】:

    猜你喜欢
    • 2020-11-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-04-10
    • 1970-01-01
    • 2014-01-25
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多