background-image属性主要用来设置或检索对象的背景图像，其值有none和url，none表示无背景图像，url为背景图像的地址，url可以用相对地值或绝对地址，例如：


在实际操作过程中，我们发现：当使用相对地址时，相对地址和css是内联还是外联是有关系的，这个问题在使用绝对地址时不存在。下边我们做些简单的测试来说明它们是有关系的，最终总结下它们有什么样的关系，测试页面结构为：


当使用内联方式时，用background-image设置index.htm中的对象的背景图像代码为：


现在我们把.bg {background-image: url(images/new_8.gif);}移到css.css文件中，改用外联的方式调用：


结果背景图像显示不出来！我们对css.css中的图片相对地址做些修改：


背景图显示出来了！再测试一次，我们把css.css内容还原为.bg {background-image: url(images/new_8.gif);}并移到images文件夹下，修改外联css地址再做测试：


背景图又显示不出来！我们再对css.css中的图片相对地址做些修改：


又正常显示出背景图了！

有兴趣的朋友可以再多做几次测试，从测试中我们可以得出结论：url相对地址应是背景图像相对于css所在文件的地址！当使用内联css时，相对地址为图像相对于htm文件的地址；当使用外联css时，相对地址应为图像相对于css文件的地址！

上一篇: 最大限度原样输出含特殊字符的指定行内容
下一篇: JScript.Encode在线加密/解密工具
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
最新日志: