PHP正在一行输出表

时间:2013-12-11 01:23:42

标签: php html css html-table wrapping

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

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;
}

2 个答案:

答案 0 :(得分:2)

您没有关闭PHP中的<table>标记。这意味着<p>正在里面表中。大多数浏览器通过将表的非表元素放在之前不同意这个无效的HTML,这就是表格沉入底部的原因。

关闭PHP中的</table>,它应该可以正常工作。

为什么不试试这个:

<?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>";
?>

答案 1 :(得分:0)

制作行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>";