Question

所以我建立了一个网站，加载Imgur的主页并将图像拉为完整尺寸，然后将它们放在我网站的主页上。唯一的问题是一些图像很大，我不知道如何调整它们的大小。我不知道我是否应该使用CSS，Javascript，或者我是否可以在PHP中使用它。

仅供参考，我正在使用Simple HTML Dom Scraper

这是我的网站：www.probablycats.com

这是我的PHP代码：

$imgur = file_get_html('http://www.imgur.com');
foreach($imgur->find('div[class="post"]') as $images)
{
    $imagelink = 'http://www.imgur.com/gallery/'.$images->id;
    $imagepage = file_get_html($imagelink);
    foreach($imagepage->find('#image') as $image2)
    {
        echo "<div class=\"images\">$image2</div>";
    }

}

这是我的CSS代码：

html
{
    background-color:#D0D0D0;
    max-width:100%;
}

.images
{
    padding:20px 20px;
    float:left;
}

所以要澄清一下，有些图像很大，超出了屏幕的宽度。我究竟会如何调整它们的大小？如果需要我可以解释更多，但如果有人能帮助我，我会非常感激。谢谢！

Answer 1

简单的方法是使用CSS：

.images img
{
    max-width: 200px;
}

这将使图像呈现所需的最大尺寸，同时保持原始比例。 注意：使用HTML宽度属性调整大小不会在所有浏览器中保持原始比例，但不会在物理上调整图像大小。但是，由于您引用了Imgur服务器上的图像，因此不会影响您自己网站的带宽。

要使用PHP执行此操作，需要将图像加载到服务器上，使用gd2或imagick调整大小，保存它们，然后引用服务器上保存的图像以便在页面上显示。这也可能违反了Imgur的T＆amp; C

Answer 2

您可以在此处指定宽度：

echo "<div class=\"images\" width=\"150px\">$image2</div>";

然而，这仍将加载整个图像，而不是从技术上缩小它。因此，如果图像很大，它仍会缓慢加载

如何调整加载到页面上的图像的大小？

2 个答案: