我正在为 CMS 构建一些基本的 HTML 代码。
CMS 中与页面相关的选项之一是“背景图像”和“将页面宽度/高度拉伸到背景图像宽度/高度”。这样，对于大的背景图像，整个事物就变得可见。
我当前的屏幕分辨率是 1280 x 1024。
如果我执行以下操作：
- 指定宽度为 1400px 的背景图片
- 将“位置”指定为“中心中心”（水平/垂直）
- 指定“将页面宽度拉伸到背景图像宽度”
那么在FF中，会发生以下情况：
- 页面正确拉伸至 1400 像素。我得到一个水平滚动条，因为我的屏幕比它小。到目前为止，一切都很好。
- 现在奇怪的事情是：背景图像是not相对于 1400px 居中，从而显示完整图像，但是相对于我的 1280px 视口，隐藏图像的一部分超出屏幕左边缘，并在右侧留下白色条纹而不是显示整个图像。
- 没有任何其他元素（DIV、包装器...）可以操纵任何内容。所有设置都直接在主体中。
更新：IE 正确执行。谷歌浏览器也有同样的问题。
就好像 Firefox 首先以 100% 宽度渲染背景图像，将其居中，然后注意到正文需要拉伸到 1400px。
这是 Firefox 的正常行为吗？
有什么想法我可以做什么吗？
发布链接会有点麻烦，因为它都在封闭的开发环境中，但如果所有其他方法都失败，我会将一些内容放在一起查看。
The CSS:
body
{
background-image: url(http://www.domain.com....image.jpg);
background-repeat: no-repeat;
background-position: center center;
min-width: 1400px;
height: 100%;
}
你被 CSS 规范的一个怪癖所困扰：感谢第14.2节 http://www.w3.org/TR/CSS21/colors.html#background，您应用到的任何背景图像body元素成为背景html反而。 （这样做的目的是让作者可以继续在 body 标签上使用他们期望来自 CSS 之前的浏览器的背景。）
In IE, html代表整个文档画布并扩展以适应放大的正文宽度。在其他浏览器中，它的行为与其他浏览器一样display: block元素并保持视口宽度，无论您在其中放入什么。其他浏览器在这里可以说更正确，但 CSS 规范在这个主题上并不是很清楚，结果是 IE 中的结果更接近地代表了 14.2 关于画布的措辞。无论哪种方式，它都不是真正指定的可靠行为。
通过设置宽度和背景，您可以在不同浏览器中获得一致的结果html代替body。 （记住在 IE 中使用标准模式。）
But a 1400px固定宽度的文档？听起来真是个糟糕的主意。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
