我正在尝试用尽可能多的东西创建一个使用％的液体网页布局.调整图像大小时,我遇到了碰撞.
都：
<img src="source" style="width: 20%; height: 20%;"/>
和
.wall_picture_block img{
width: 20%;
height: 20%;
}
不适合高度属性.他们将图像宽度调整为容器的20％,但高度保持相对于图像大小.(我试图制作正方形)
解决方法
图像的高度和宽度属性的百分比与其所包含的容器一起工作.因此,为了实现流体效果,只需尝试放入img周围的容器并给出图像高度和宽度：100％.现在你应该以百分比的形式改变容器的高度和宽度.这是一个例子
<div style="width: 500px; height: 100px;"> <img src="your-image-link-here" style="height: 100%; width: 100%;"> </div>
这样您的图像将达到500 * 100的高度和宽度.
UPDATE
<div id="wrapper" style="border: 1px solid red; width: 900px; height: 400px;">
<div id="imgcontainer" style="width: 100%; height: 50%;">
<img src="ur-img" style="height: 100%; width: 100%;">
</div>
</div>
包装器和具有百分比的容器的示例.
