php - 显示来自 TABLE 的具有不同大小的个体的图像

Question

我的设计计划是从表格中获取所有图像并分别调整任何尺寸的图像。所以类名是改变大小的关键。如何以不同尺寸显示它？

include 'conn.php';

$viewquery= "SELECT id, product_image, product_cat FROM products WHERE product_cat LIKE 'Sale'";

$result = mysqli_query($connection, $viewquery);
$fetch = mysqli_fetch_assoc($result);

echo' <div class="div-frame-five">';
    echo' <img src="images/'.$fetch["product_image"].'" alt="" class="image-one-frame">';
    echo' <img src="images/'.$fetch["product_image"].'" alt="" class="image-two-frame">';
    echo' <img src="images/'.$fetch["product_image"].'" alt="" class="image-three-frame">';
    echo' <img src="images/'.$fetch["product_image"].'" alt="" class="image-four-frame">';
echo' </div>';

示例

Answer 1

您可以使用 css 和您的类来格式化图像。例如-

img {
  height: 200px; // set a standard height
  padding-bottom: 5px; // add a space between the img rows
}
.image-one-frame, .image-four-frame {
  width: 66%; // make one and four 2/3 the width
}
.image-two-frame, .image-three-frame {
  width: 33%; // make two and three 1/3 the width
}
.image-one-frame, .image-three-frame {
  float: left; // make one and three float left
}
 .image-two-frame, .image-four-frame {
  float: right; // make two and four float right
}

参见 https://jsfiddle.net/5ry7dLug/10/