`
tibaloga
  • 浏览: 876895 次
文章分类
社区版块
存档分类
最新评论

java工程里CSS背景图片路径设置

 
阅读更多
  1. 在CSS文件里,有时要用到background,即加一个背景图片,一般在做按钮样式时会经常用到。<wbr></wbr>
  2. css中加背景图片根据图片及css文件的相对位置分一下几种类型:<wbr></wbr>
  3. 1.同包下:background<wbr>:<wbr>url(aaa.gif);</wbr></wbr><wbr></wbr>
  4. 2.不同包:<wbr></wbr>
  5. <wbr><wbr><wbr><wbr>在这种情况下有2中方法可以设置,一种是使用绝对路径,即http://www.iteye.com/aaa.gif这种,不过一般不推荐这么用,不利于项目移植;一种是使用相对路径,首先需要找到图片文件和css文件共同的一个根目录,然后再加上图片的子目录,比如:</wbr></wbr></wbr></wbr><wbr></wbr>
  6. <wbr><wbr><wbr><wbr>css文件位置:WebRoot/test/css/a.css</wbr></wbr></wbr></wbr><wbr></wbr>
  7. <wbr><wbr><wbr><wbr>图片文件位置:WebRoot/platform/resource/images/icons/a.gif</wbr></wbr></wbr></wbr><wbr></wbr>
  8. 想要找到共同的根目录就需要用到<wbr>"../"<wbr>这个路径的意思是上一级目录,如果是两层上级目录,就是<wbr>"../../"<wbr>那么,按照这种写法的话,a.css中得背景图片css应该这么写:</wbr></wbr></wbr></wbr><wbr></wbr>
  9. <wbr><wbr><wbr><wbr>background:url(../../platform/resource/images/icons/a.gif)</wbr></wbr></wbr></wbr><wbr></wbr>
  10. 为什么呢?<wbr></wbr>
  11. <wbr><wbr>首先,我们观察这两个文件的位置,可以发现,共同的根目录是WebRoot,</wbr></wbr><wbr></wbr>
  12. 我们首先在a.css的位置找到WebRoot,所以有了"../../"<wbr>然后拼接图片的子目录的路径<wbr>又有了"platform/resource/images/icons/a.gif"<wbr>合在一起后就是上面的结果了。</wbr></wbr></wbr>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics