在DIV上实现跨浏览器兼容性的"背景大小:覆盖"后备/垫片/技巧？
Ang*_*ino 5 javascript css fallback shim css3
所以我background-size:cover用来实现背景图像的预期效果,该背景图像可以扩展到应用的div的任何大小,同时保持纵横比.为什么要用这种方法？使用内联CSS将图像作为背景应用,动态地通过PHP,基于相关WordPress帖子中的图像设置.
所以一切都很好,但有没有任何后备,以确保这至少在IE8中工作？可能是一些Javascript修复？
已经尝试过后退和超大,但无济于事,因为他们只将图像应用于页面的背景.
你可以在这里看到它.
在IE8或更低版本中,作为具有定义宽度/高度的div的子项插入的前景图像将是唯一的解决方法:
<!doctype html>
<html lang="en">
<head>
<title>Dynamic Image Sizing</title>
<style type="text/css">
html, body { margin:0; padding:0; width:100%; height:100%; overflow:hidden; text-align:left; }
#pseudobg { position:absolute; z-index:1; width:100%; height:100%; }
#scroller { position:absolute; width:100%; height:100%; top:0; left:0; overflow:auto; z-index:2; }
#dyndiv { position: absolute; left: 50%; width: 200px; height: 300px; }
</style>
</head>
<body>
<div id="scroller">
<!-- Insert your content here -->
<div id="dyndiv">
<img id="pseudobg" src="http://www.stackoverflow.com/favicon.ico" alt="" title="" />
</div>
</div>
</body>
</html>
如果这不相同,请向Stu Nicholls寻求进一步的帮助.
演示:
