在 HTML 中使用边距图像？答案

【问题标题】：Using Margin Images in HTML?在 HTML 中使用边距图像？
【发布时间】：2013-02-03 10:46:46
【问题描述】：

我知道很多 HTML，但都是自学成才的，在尝试使网站看起来像我真正想要的样子时，我不断遇到这些未知数。

我想让我的网站的宽度至少为 940 像素——如果浏览器的宽度小于这个宽度，用户将不得不水平滚动。

但是，如果浏览器的宽度超过 940 像素 - 我希望图像看起来与我的标题图像（显示为全宽标题）和导航图像（显示为全宽导航）“连接”。

查看附件以了解我的意思。肖恩

【问题讨论】：

【解决方案1】：

如果您有一个大于 940 像素的图像作为您的宽度，那么您可以将图像的背景位置设置为居中，这样如果它增加或减少图像不会仅移动显示的数量。

另一种方法可能是重复背景图像，使其不会结束...但这取决于您使用的图像类型...

【讨论】：

【解决方案2】：

在 CSS 中：

 header{ min-width: 940px; width: 100%; overflow: hidden; }
 .headerImage { display: block; margin: 0 auto; }

然后在 HTML 中：

<header>
    <img class="headerImage" src="./Images/HeaderImage.png" alt="" />
</header>

【讨论】：

【解决方案3】：

试试这个

<style type="text/css">
img {
  min-width:940px;
  width:100%;
  height:auto;
}
</style>

【讨论】：