html - 具有 100% 图像高度的水平滚动

Question

我目前正在构建一个水平滚动的投资组合。我希望图像是 100% 高和宽度：自动。一切正常（纯 CSS），但如果浏览器窗口小于图像宽度，它就会被压缩。

这是链接：http ://www.bastards-design.de/wordpress/category/allgemein/portfolio/grafik/#alina

Answer 1

如果浏览器窗口小于图像宽度，则会被压缩。

我查看了您的代码并在其中发现了以下 CSS，这会导致图像压缩。如果删除它，图像将不会压缩。

img{
   max-width:100%;
}

似乎此规则是从您正在使用的bootstrap.ccs继承的。您应该删除此规则或覆盖它。

Answer 2

您需要max-width从bootstrap.css 您当前删除的内容如下：

img {
    border: 0 none;
    max-width: 100%;
    vertical-align: middle;
}

不要尝试删除max-width: 100%;如下：

img {
    border: 0 none;
    vertical-align: middle;
}

这应该有效。