HTML：如何使图像不影响整个站点的宽度？答案

【问题标题】：HTML: How to make an image NOT have influence on the width of whole site?HTML：如何使图像不影响整个站点的宽度？
【发布时间】：2016-11-12 13:21:48
【问题描述】：

我从中心左右有 2 个图像，它们放置得很好，但是当屏幕尺寸

图片的CSS（简单的放在body中）：

#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;
}

【问题讨论】：

请添加一个带有html的cde示例，最好包括一个实时工作示例，例如jsfiddle / codepen / plunkr
overflow-x:hidden

标签： html css image width border

【解决方案1】：

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

您可以在主体 css 中声明 overflow-x 属性设置为 none 或 hidden，从而有效地切断多余的像素。但是，在固定的图像尺寸下，这在较小的浏览器上可能并不理想。请记住，许多人的显示器小于 1920 像素。
您可以使用 CSS3 中的一个漂亮的小工具，称为媒体查询。使用它们，您可以根据监视器的宽度或高度更改 css 规则。使用这种方法，您可以确保它在所有大小的浏览器窗口中都显示为完整。

【讨论】：

很高兴能为您提供帮助！