将整个图像显示为缩略图而不裁剪


Display whole image as a thumbnail without cropping

在此代码中,如何将缩略图大小中心从图像完全适合更改为 240 x 240 大小的缩略图?

<?php
$directory = 'images';
$allowed_types=array('jpg','jpeg','gif','png');
$file_parts=array();
$ext='';
$title='';
$i=0;
$dir_handle = @opendir($directory) or die("There is an error with your image directory!");
while ($file = readdir($dir_handle)) 
{
    if($file=='.' || $file == '..') continue;
    $file_parts = explode('.',$file);
    $ext = strtolower(array_pop($file_parts));
    $title = implode('.',$file_parts);
    $title = htmlspecialchars($title);
    $nomargin='';
    if(in_array($ext,$allowed_types))
    {
        if(($i+1)%4==0) $nomargin='nomargin';
        echo '
        <div class="pic '.$nomargin.'" style="background:url('.$directory.'/'.$file.') no-repeat 50% 50% ;">
        <a href="'.$directory.'/'.$file.'" title="'.$title.'" target="_blank">'.$title.'</a>
        </div>';
        $i++;
    }
}
closedir($dir_handle);
?>

你能尝试在 css 中使用background-size属性吗?

background: color position size repeat origin clip attachment image;

 background-size:240px 240px;

CSs:

<style>
    .thumbnail{     
        background-repeat:no-repeat;         
        background-size:240px 240px;
        background-position:center; 
    }
</style>

.PHP:

 <?php    
    echo '
        <div class="pic thumbnail '.$nomargin.'" style="background-image:url('.$directory.'/'.$file.');">
            <a href="'.$directory.'/'.$file.'" title="'.$title.'" target="_blank">'.$title.'</a>
        </div>';
 ?>