internet-explorer - Internet Explorer 7 中的 css 背景大小封面

标签 internet-explorer internet-explorer-7 css

<分区>

我知道 IE7 不支持 background-size cover。

我在网上搜索了一些解决方案，但我唯一得到的是我应该放一个 img 和 width: 100% 和 height :100% 并将其作为背景。

这是唯一的解决方案吗？我见过一些使用 -ms-filter 的解决方案，但没有用。有人有其他解决方案吗？

1 件特别的事: 我有超过 1 个 div 至极具有此 background-size 封面属性。

在 Firefox 中一切正常(多么令人惊讶)。

Edit1:我的代码如下所示:

<div class="section" id="section1">here should be the first picture as the background!!</div>
<div class="section" id="section2">here should be the second picture as the background!!</div>
<div class="section" id="section3">here should be the third picture as the background!!</div>

最佳答案

使用 Modernizr您可以发现用户浏览器的功能。

通过在标题中链接来安装 Modernizr

<script src="http://www.modernizr.com/downloads/modernizr-latest.js"></script>

在你的 HTML 标签中，

<html class="no-js">

使用 CSS，您可以在浏览器支持的情况下设置页面样式 - Check the documentation支持什么检测。在这种情况下，我们需要 background-size 类

在你的 CSS 文件中——对于没有背景大小的浏览器(也就是 IE)

.no-background-size #image{
background-image: url(lol.png);
min-height: 100%;
min-width: 100%;
}

这适用于执行以下操作的浏览器:

.background-size #image{
background-image: url(lol.png);
background-size: cover;
}

使用此方法更符合标准，因为将来 min-height: 100% 等标签可能不再使用。

关于internet-explorer - Internet Explorer 7 中的 css 背景大小封面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5895571/

上一篇：css - scaleZ() CSS 转换函数有什么作用？

下一篇：CSS 绘制箭头的 CSS 投影

相关文章：

IE 中的 ASP.NET 页面在其他程序中窃取焦点

html - 在 IE7 中正确对齐一行上的两个 div

jQuery XML 解析 IE7/IE8

css - 是否可以将文本对齐与 Braintree Hosted Forms 一起使用？

html - 为什么 <li> 之间有空格？

css - IE加载字体时出现404错误

javascript - IE 中的 JS 对象中不允许使用哪些对象属性？

javascript - Number.prototype.toFixed : amazingly correct in Internet Explorer

javascript - 窗口调整大小事件在 ie7 中不断触发

css - 响应模式在使用 Artisteer 制作的 Joomla 模板中不起作用