HTML: 如何让一张图片不影响整个网站的宽度？

HTML: How to make an image NOT have influence on the width of whole site?

我有 2 张图片从中间开始左右放置，位置很好，但是当屏幕尺寸 < 1920 像素时，会创建一个滚动条，因为右边的图片会 "out of the Site"。我只是希望它被剪切到屏幕大小/越过屏幕的一侧而不加宽它。

CSS 个图像（简单地放在正文中）：

#fans_l {
 position: absolute;
 text-align: left;
 margin-left: -955px;
 margin-top: -228px;
 z-index:3;
}

#fans_r {
 position: absolute;
 text-align: left;
 margin-left: 399px;
 margin-top: -228px;
 z-index:3;
}

正文css:

body {
  height: 100%;
  width: 100%;
  margin: 0px;
  background-image:url(p/back.jpg);
  background-repeat: repeat; text-align: center;
}

在这种情况下，您可以做几件事。想到的前两个如下：

  1. 您可以在主体 css 中声明将 overflow-x 属性 设置为 none 或隐藏，从而有效地切断多余的像素。但是，在固定图像大小的情况下，这在较小的浏览器上可能是不可取的。请记住，许多人的显示器小于 1920 像素。

  2. 您可以使用 CSS3 中的一个名为媒体查询的漂亮小工具。使用它们，您可以根据显示器的宽度或高度更改 css 规则。使用此方法，您可以确保它在所有尺寸的浏览器上显示完整 windows.