Question

我在制作网上商城页面时遇到了这个问题。

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

我想添加类似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>

Answer 1

我想添加这样的东西，我想：

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

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

在哪里找到这些功能

首先检查官方PHP手册中的函数参考。

然后你会找到一个关于图像处理的专门章节：

Image Processing and Generation

事实证明，有几个库提供了所需的功能。例如，如果您使用GD，则会提供getimagesize和imagescale。 Gmagick和ImageMagick具有相似的功能，只是名称不同。

HTML根据大小调整图像大小

1 个答案: