如何更改img宽度但保持原始高度在CSS?

时间:2016-01-27 20:08:18

标签: html css image

在css中,如何将图像宽度更改为两倍大,但保持高度与原始高度相同?

我试过

img {
    width : 400px;
    height : auto;
}

它适用于IE11 +。图像也是动态加载的,所以我不知道原始高度,但我知道宽度(它是指定的参数)。

但它不起作用

2 个答案:

答案 0 :(得分:0)

两倍大或正好400px宽?

要进行两次(或者更大或更小x次),您可以使用CSS3 scale转换。

img {
  transform: scale(2);
}

这会使图像在所有方向上都生长到位,所以也许你还想稍微移动一下:

img {
  transform: scale(2) translate(25%, 25%);
}

CSS3 transform functions。很有用。

答案 1 :(得分:-1)

你的css代码是否正确

检查图像的原始尺寸

或他父母的显示或宽度



img{
  width: 400px;
}




总是你必须设置图像的宽度和图像的高度自动设置图片原始尺寸的比例