图像超大HTML

Question

如何通过PHP在目录中查找图像来解决我的简单HTML照片库中的图像过大问题？我无法解决它，但视觉上并不好。你能帮我么？截图是

感谢。

Answer 1

使用相同的类设置所有图片，然后将图像高度添加到该类，并将图像设置为所有相同的高度。

以下是我刚才做的一个例子 - http://jsfiddle.net/3gd5ooLf/

我不确定你是如何用PHP获取图像所以我不能告诉你如何设置类而不看一些代码。

这是CSS示例：

.height {
    height: 100px;
}

Answer 2

这可能是一个很好的例子。请参阅stackoverflow旧问题。这是链接：link

    .img {
    position: relative;
    float: left;
    width:  100px;
    height: 100px;
    background-position: 50% 50%;
    background-repeat:   no-repeat;
    background-size:     cover;
}

<div class="img" style="background-image:url('http://i.imgur.com/tI5jq2c.jpg');"></div>

Answer 3

在css文件中，您可以添加heigth和width属性来调整图像大小。

例如：

img {

  heigth:200px;
  width: auto;

}

将高度设置为200px，但将保持纵横比。要获得方形图像，请将宽度设置为，例如200px

如果您愿意，可以将图像设置为可滚动的时间太长，如下所示：

img {

  height:200px;
  width:200px;
  overflow: scroll;

}