在 Edge 和 IE 中调整背景大小

Posted 2023-03-06

技术标签:

【中文标题】在 Edge 和 IE 中调整背景大小【英文标题】：Background resizing in Edge and IE 【发布时间】：2017-03-29 09:14:10 【问题描述】：

我正在使用背景图片升级我们的 wordpress 网站，您可以在链接中看到：http://www.financnitrgi.com/

背景在 Chrome、Opera 和 Firefox 中调整得很好，但在 IE 和 Edge 中则是另一回事。当网站在 IE/Edge 中加载时，背景是好的，但是当调整浏览器窗口的大小时，背景开始在网站的文本下移动，这不是它应该做的。

有人遇到过这类问题吗？

我用于背景的代码：

div.content
background: url(http://www.financnitrgi.com/wp-content/uploads/bankakoper.jpg) center;
background-attachment: fixed;
background-size: auto 100%;
background-repeat: no-repeat;

【问题讨论】：

我不确定能否重现该问题。该网站在所有浏览器中看起来都一样，我可以看到问题，但在所有浏览器中都可以看到相同的问题，而且它们不仅仅在调整大小时开始。但如果你只检查背景图像并将其与各种浏览器（即 Chrome 与 Edge 或 Internet Explorer）中的行为进行比较，则会有很大的不同。在资源管理器中，背景位于文本下方，而在 Chrome 中则没有。这是我正在研究的具体问题。我没看到，抱歉。就像我说的，我看到了问题，但在不同的浏览器中它们是相同的问题。你能提供一些你看到的差异的截图吗？ 【参考方案1】：

您有一些标记错误，不同的浏览器可能会以不同的方式纠正/补偿....对于 IE，请先转到 Internet 选项>高级选项卡，选中“始终记录开发人员控制台消息”..保存更改。

现在在网站上打开 IE。按 f12 显示开发工具，选择控制台选项卡，它应该显示以下错误/警告

html1300：发生导航。 www.financnitrgi.com

JQMIGRATE：已安装 Migrate，版本 1.4.1 HTML1512：结束标记不匹配。

www.financnnitrgi.com (393,2) HTML1514：发现额外的“

”标签。每个文档只能存在一个“”标签。 www.financnnitrgi.com (396,2)

HTML1509：结束标签不匹配。 www.financnnitrgi.com (1355,90)

HTML1523：结束标记重叠。 www.financnnitrgi.com (1798,75)

在此处查看验证器结果w3c validation

纠正这些错误......

仅当 IE 的 ActiveX 过滤关闭时才会出现背景大小调整问题.... 工具>ActiveX 过滤以打开您的 IE ActiveX 过滤......这会阻止 Flash（这是 MSIE 浏览器中的 ActiveX 控件）加载......

当打开 IE 的 AX 过滤时，您的网站使用后备 img 元素，这些元素没有背景问题...结论是 flash 对象的大小不正确。使用 css 高度和宽度而不是表示属性...（取决于，w3c 验证器会选择这个来提醒您使用 css 来调整元素大小而不是表示属性）