全宽图像容器

我想在引导程序的容器中拥有全宽度响应图像。我使用的图像的大小是800×667。当我使用下面的代码时，会发生什么情况是图像在大屏幕中没有完全缩放。有人能帮助我吗？全宽图像容器

<div class="myDiv"> 
     <img class="myImage" src="...." > 
    </div>

的CSS：

.myDiv { 
    padding: 0; 
} 
.myImage { 
    max-width: 100%; 
    height: 500px; 

}

2016-09-11 Bing

你想要的形象留在高度500像素，无论屏幕的宽度是多少？ – phpheini

请创建jsfiddle。 – user6801750

不，但即使如果我设置它自动，图像不缩放全宽。我想知道为什么？ – Bing

你有一个固定的高度。尝试设置高度：自动;以保持规模

2016-09-11 14:29:47 Zedkay22

我试过，但仍然是图像未缩放全宽。 – Bing

这是你应该发表评论，而不是回答。 – Dekel

从最大宽度中删除“max”，所以它只是宽度：100％ – Zedkay22

你应该做的是删除max-width并用width替换它。

如果要将其设置为特定高度，请使用image上的transform: scaleX(), scaleY()属性。

.myImage { 
    transform: scaleX(1.5); //scales the image 1.5 times for the X-axis 
}

.myDiv { 
 
    padding: 0; 
 
} 
 
.myImage { 
 
    width: 100%; 
 
}

<div class="myDiv"> 
 
    <img class="myImage" src="http://instantentity.com/wp-content/uploads/2016/02/Instant-Entity-CSS.jpg"> 
 
</div>

2016-09-11 14:51:32

回答