上周更新了我的网站设计,并在不同的浏览器和设备上对其进行了测试——这是一个使用 Bootstrap 的投资组合网站——一切都很好。我今天早上在我的宽屏显示器上使用 chrome 检查了我的网站,全宽图像的尺寸似乎已经缩小,在右侧留下了空白。
此异常不会出现在不同的浏览器上,甚至不会出现在使用较小屏幕的 Chrome 上!
该网站的实时地址为 http://www.burnser.com/index.html
如有任何帮助,我们将不胜感激。谢谢!
最佳答案
图像本身只有 1600 像素的原始宽度。如果它们应该始终全屏显示,您应该在 CSS 中包含 width: 100%;
。
.carousel-inner>.item>a>img,
.carousel-inner>.item>img,
.img-responsive,
.thumbnail a>img,
.thumbnail>img {
display: block;
width: 100%;
max-width: 100%;
height: auto;
}
关于html - 在宽屏显示器上,Chrome 中的网站布局突然发生了变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41854650/