基于它的大小的HTML调整大小图像

上传到我的数据库的大部分照片都有不同的大小，我不得不调整它们的大小。但是当我这样做的时候，当我将所有的高度设置为相同时，一些图片的分辨率变得非常糟糕。

我想添加一个像if子句的东西，它决定了图像的大小，然后只调整大于给定大小的图像的大小。

我想补充的东西看起来是这样的，我想：

if (img height < 300px) { 
    img height = "100px"; 
} else { 
    img height = "400px"; 
}

这里是我当前的代码：

<ul class="prdList column4"> 
     <li class="item" id="anchorBoxId_{$product_no}"> 
      <div class="box"> 
       <span class="chk"><input type="checkbox" class="{$product_compare_class} {$product_compare_display|display}" /></span> 
       <a href="/product/detail.html{$param}" name="anchorBoxName_{$product_no}"><img src="{$image_big}" id="{$image_medium_id}" alt="" class="thumb" /></a> 
       <div class="status"> 
        <div class="icon">{$soldout_icon} {$recommend_icon} {$new_icon} {$product_icons} {$benefit_icons}</div> 
        <div class="button"><div class="option">{$option_preview_icon}</div> {$basket_icon} {$zoom_icon}</div> 
       </div> 
       <p class="name"> 
        <a href="/product/detail.html{$param}" class="{$product_name_display|display}"><strong class="title {$product_name_title_display|display}">{$product_name_title} :</strong> {$product_name}</a> 
       </p> 
       <ul module="product_ListItem"> 
        <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li> 
        <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li> 
       </ul> 
      </div> 
     </li> 
     <li class="item" id="anchorBoxId_{$product_no}"> 
      <div class="box"> 
       <span class="chk"><input type="checkbox" class="{$product_compare_class} {$product_compare_display|display}" /></span> 
       <a href="/product/detail.html{$param}" name="anchorBoxName_{$product_no}"><img src="{$image_big}" id="{$image_medium_id}" alt="" class="thumb" /></a> 
       <div class="status"> 
        <div class="icon">{$soldout_icon} {$recommend_icon} {$new_icon} {$product_icons} {$benefit_icons}</div> 
        <div class="button"><div class="option">{$option_preview_icon}</div> {$basket_icon} {$zoom_icon}</div> 
       </div> 
       <p class="name"> 
        <a href="/product/detail.html{$param}" class="{$product_name_display|display}"><strong class="title {$product_name_title_display|display}">{$product_name_title} :</strong> {$product_name}</a> 
       </p> 
       <ul module="product_ListItem"> 
        <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li> 
        <li class="{$item_display|display}"><strong class="title {$item_title_display|display}">{$item_title} :</strong> {$item_content}</li> 
       </ul> 
      </div> 
     </li> 
    </ul> 
</div>

来源

2017-08-17 Lee SinWoo

在上传到您的数据库之前，您最好使用简单的图片工具手动调整它们大小 – codemax

@codemax我想这是卖家上传图片。强制卖家上传特定尺寸的图片是一个简单的解决方案，但不是用户友好的。 – weakish

我正在调整现在上传的所有新图像，但我无法对之前发布的图像进行任何操作，因为它们太多了，我无法手动修复所有这些图像=（ –

我想补充的东西看起来是这样的，我想：

if (img height < 300px) { 
    img height = "100px"; 
} else { 
    img height = "400px"; 
}

你猜对了。您只需找到检测和更改图像大小的功能即可。

在哪里可以找到这些功能

首先检查在官方PHP手册中的函数引用。

这时你会发现在图像处理的专用部分：

Image Processing and Generation

原来，几个图书馆提供所需的功能。例如，如果您使用的是GD，则它提供getimagesize和imagescale。 Gmagick和ImageMagick具有类似的功能，只是名称不同而已。

来源

2017-08-17 02:42:33 weakish

感谢您的回复并更正了我的错误语法=）我会试着更多地研究你提供给我的那些引用来解决我的问题 –

基于它的大小的HTML调整大小图像

回答

相关问题