如何在网页中设定根据元素大小伸缩的背景图？

最近研究了一下CSS，发现了些有趣的问题，原来W3C的标准也不是统一地在每个游览器是能够一致。当然也有一些CSS棘手的难事，背景图就是一个问题，CSS只支持背景图放置的位置设定以及如何平铺，想拉伸是没有办法的。于是给出一个解决办法：
首先需要一个javascript的函数：
function setAutoBack(obj,img) { try { var dyback = document.getElementById(obj); img.style.height = dyback.offsetHeight; img.style.left = dyback.offsetLeft; img.style.top = dyback.offsetTop; img.style.width = dyback.offsetWidth; img.style.zIndex = -1; } catch(ee) { try { img.style.display="none"; } catch(err) { } } }
然后在页面中写一个＜IMG＞：
<img src="back.jpg"onload="setAutoBack('targetID',this)" style="position:absolute;">

上面的“back.jpg"是背景图，"targetID"是被设定HTML元素的ID。

最后还要请注意一点，就是在IE下这样就可以了，但以firefox中则另需要在＜BODY＞中加入样式： style="z-index:0;position:absolute;"

另外对于其他的游览器没有试过。

本文地址：http://www.45fan.com/a/question/68988.html