css中图片路径问题的示例分析-创新互联
这篇文章主要介绍css中图片路径问题的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
网站设计制作过程拒绝使用模板建站;使用PHP+MYSQL原生开发可交付网站源代码;符合网站优化排名的后台管理系统;网站建设、做网站收费合理;免费进行网站备案等企业网站建设一条龙服务.我们是一家持续稳定运营了十载的成都创新互联公司网站建设公司。在CSS文件里,有时要用到background,即加一个背景图片,一般在做按钮样式时会经常用到。
css中加背景图片根据图片及css文件的相对位置分一下几种类型:
1.同包下:background : url(aaa.gif);
2.不同包:
在这种情况下有2中方法可以设置,一种是使用绝对路径,即/tupian/20230522/404.html
css文件位置:WebRoot/test/css/a.css
图片文件位置:WebRoot/platform/resource/images/icons/a.gif
想要找到共同的根目录就需要用到 "../" 这个路径的意思是上一级目录,如果是两层上级目录,就是 "../../" 那么,按照这种写法的话,a.css中得背景图片css应该这么写:
代码如下:
background:url(../../platform/resource/images/icons/a.gif)
为什么呢?
首先,我们观察这两个文件的位置,可以发现,共同的根目录是WebRoot,
我们首先在a.css的位置找到WebRoot,所以有了"../../" 然后拼接图片的子目录的路径 又有了"platform/resource/images/icons/a.gif" 合在一起后就是上面的结果了。
以上是“css中图片路径问题的示例分析”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!
本文名称:css中图片路径问题的示例分析-创新互联
URL链接:http://ybzwz.com/article/djsggi.html