Question

嗨我有这个简单的PHP脚本来显示文件夹中的图像。我的问题是图像显示非常紧密。我想在图像和边框之间为每个图像添加一些空间。请帮助我。

$files = glob("images/gallery/thumb/*.*");
for ($i=1; $i<count($files); $i++)

{

$image = $files[$i];

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

Answer 1

或者，如果你想要一种网格：

    $files = glob("images/gallery/thumb/*.*");
    $count = count($files);
    for($i = 1; $i < $count; $i++){
    $image = $files[$i];
    echo '<img src="'.$image .'" alt="Random image" style="border:2px solid black; margin: 5px; float: left;" />';
}

Answer 2

对两张图片之间的空格使用纯HTML换行符<br/> 对边框使用CSS style="border:2px solid black;"（根据需要更改）我建议你将count($files)存储在一个变量中;否则，必须在for循环的每次迭代中对其进行评估，从而导致脚本运行速度变慢现在您的整个代码将如下所示：

$files = glob("images/gallery/thumb/*.*");
$count = count($files);
for($i = 1; $i < $count; $i++){
$image = $files[$i];
echo '<img src="'.$image .'" alt="Random image" style="border:2px solid black;"/><br/>';
}

Answer 3

我会将一个班级附加到图像上。

echo '<link rel="stylesheet" href="gallery.css" type="text/css"';

...

$files = glob("images/gallery/thumb/*.*");
foreach ($files as $image){
    echo '<img src="'.$image .'" alt="Random image" class="galleryImage"/>';
}

然后使用该类的样式创建一个.css文件。这将允许您通过.css轻松更改样式，而无需触摸您的PHP代码，并将使您渲染的html文件略小。

gallery.css

img.galleryImage{
    border: 2px solid #888888;
    padding: 10px;
}

查看文件夹中的图像

3 个答案: