CSS - 如何防止浏览器在 div 超出窗口时显示滚动条？

Question

我有一个带有以下 CSS 的居中包装器:

div.wrapper {
width: 1170px;
padding-left:30px;
margin-top: 80px;
margin-bottom:20px;
margin-left: auto;
margin-right: auto;
position:relative;  
background-color:black; }

里面我有一个带有以下CSS的div:

position:absolute;
top:-26px;
left:517px;
height:63px;
z-index:3;

这个 div 内部是一个宽度为 759px 的图像，它使包装器变大并使浏览器在较低的显示分辨率下显示 v-scrollbar。我想要的是使图像超出包装器但阻止浏览器显示滚动条，以便仅当您的浏览器窗口足够大并且包装器保持其 1200 像素宽度时才显示图像的右侧。我无法将其设为背景图片，因为它覆盖了其他一些内容。与 >= IE7 兼容的东西会很好。

我上传了一张页面图片来说明我的意思: http://img153.imageshack.us/img153/6070/hpx.jpg

蓝色框是包装器，它有 1200 像素的宽度，并且始终位于窗口的中央(除非窗口小于 1200 像素，然后它会滚动)红色框是图像(绿色条不是它的一部分)

Answer 1

您可以为包装器设置overflow: hidden，这样超出包装器尺寸的内容将不会显示。

参见 overflow