如何在html标签中显示适合DIV的肖像图像?

时间:2015-07-10 08:57:45

标签: html css

我有肖像图像,我想以相同的比例适合DIV标签。 您可以在以下链接中找到示例图片

http://www.megafileupload.com/4Loy/img.png

1 个答案:

答案 0 :(得分:0)

如果想要保持DIV的高度和宽度并使图像适合DIV,同时保持图像比例,那么您的代码就已经这样做了。

请参阅jsfiddle添加的边框,显示图片如何变得更大,因为它已经填充了父DIV高度。

如果你想改变它以使DIV高度对图像属性作出反应,那么删除DIV高度并添加以下img规则:

img {width: 100%; height: auto;}

这将在保持图像比率的同时填充父容器宽度,DIV高度将自动响应以适合图像。

示例2:jsfiddle