怎样设置CSS背景图片路径

html-css010

怎样设置CSS背景图片路径,第1张

.a{background-image:url(图片路径)}

图片路径可以是绝对路径、根相对路径和文档相对路径

绝对路径是包括服务器协议的完全路径，比如“百度主页”，完全路径为：http://www.baidu.com/index.htm，如果所要链接当前站点之外的文档，就必须使用绝对路径。

相对路径包括根相对路径（Site

Root）和文档相对路径（Document）两种。

根相对路径（也称相对跟目录）的路径以“/”开头，路径是从当前站点的根目录开始计算。比如我们前面建的D盘myweb目录就是名为“myweb”的站点，这时“/index.htm”

路径，就表示文件位置为D:\myweb\index.htm。根相对路径适用于链接内容频繁更换环境中的文件，这样即使站点中的文件被移动了，其链接仍可以生效。

文档相对路径就是指包含当前文档的文件夹，也就是以当前网页所在文件夹为基础开始计算路径。比如，当前网页所在位置为

D:\myweb\mypic，那么：

“a.htm”就表示

D:\myweb\mypic\a.htm；

“../a.htm”相当于

D:\myweb\a.htm，其中“../”表示当前文件夹上一级文件夹。

“img/a.gif”是指

D:\myweb\mypic\img\a.gif，其中“img/”意思是当前文件夹下名为

img

文件夹。

文档相对路径是最简单的路径，一般多用于链接保存在同一文件夹中的文档。

换成图片路径也是

一样的道理

是依照css文件所在路径来确定背景图片的相对路径的，所以最好是把css文件与图片放在同一文件夹，这样就无需再写图片的路径（不管这个css文件被哪个html文档引用都一样），只写图片文件名即可，服务器会自动在css文件所在文件夹查找图片。

顺便说一句：如果是直接写在html文档内的css代码，里面的背景图片路径则是按照html文档所在路径来计算的。

1. 请题主先看看浏览器的控制台是否有相应的报错提示；

2. 其次，题主这个页面是否在根域名下的，如果不是，那还真有可能路径错了；

3. 既然楼主都用 addClass 了，可以考虑将 css 写在 css 文件的一个 class 里，而不需要用 jQuery 来更变 style，这样你可以写少点 js，同时方便管理 css。（同时避免相对路径问题）