刚刚碰到一个奇怪的问题,这样一段CSS代码: 

  .pho6 { background: url(img/pho6.jpg);  } 

这段代码居然不能显示出背景图片,路经绝对是没错的
代码肯定没有问题,俄,百度了好久终于让我给找到了
真正的问题在哪? 

在url(imagepath)里的这个imagepath(图片路径)。原来它是相对于.css文件所在的文件夹,也就是调用css文件夹下的子文件夹来获取路径地址,

通过浏览器调试,可以看到浏览器获取路径是从css下面的img来找我的图片的,但是

我的img和css是平级的文件夹,就是说css下面是没有img这个文件夹存在的,所以浏览器当然报错了,因为根本找不到嘛

简单点说,就是假如我文件夹下有一个index.html,它要调用index.html所在的一个子文件夹css下的style.css文件,背景图片存放在与css文件夹同级的img文件夹下,于是乎,这里的CSS应该这样写: 

background:url(../img/pho6.jpg) ;

灵感来源:烈火网

CSS中background:url(图片) 不能显示的问题的更多相关文章

  1. Vue项目打包发布后CSS中的背景图片不显示

    相信有很多同学在学习vue的刚开始都遇到过项目打包发布后发现CSS中的背景图片不显示,具体如何解决只需要更改bind的配置即可 修改 build/utils.js 中的 generateLoaders ...

  2. webpack生成的css文件background-image url图片无法加载

    之前在使用webpack3构建基于less预处理的项目时,在对指定的元素使用background-image: url(xxx)来设置背景图片时,本地开发是ok的,但是在项目编译产出后背景图片就找不到 ...

  3. css中background背景属性概

    css中background背景属性概 background:url(背景图片路径)  no-repeat;/*不重复默认在左上方*/background:url(背景图片路径)  no-repeat ...

  4. CSS中background属性详解

    CSS背景属性 background css 说明 background-image:url(图片的网址); 背景图 background: url( 图片的网址 ); 背景 background-c ...

  5. CSS中background的用法

    CSS中  background 是一个很基本的而且比较常用的样式 background : background-color || background-image || background-re ...

  6. 在word中粘贴的图片为什么显示不完整

    一.背景 整理系统测试说明文档,截得图片粘贴到word中显示不完整. 二.错误问题 问题:在word中粘贴的图片为什么显示不完整,如图所示: 三.分析问题: 原因是原来设置的行间距是固定值,图片也作一 ...

  7. css 中的背景图片小技巧和存在的坑

    body 的背景图设置 第一种 :这种情况下背景图片可以缩放 但是不能完全等比缩放 background: url(imgs/1.jpg)no-repeat; background-position: ...

  8. ie8 background背景图片不显示问题

    在chrome,FF可以显示,但是在ie8背景图片显示不出来 css改为如下可以正常显示: background: url(../images/goods.png) no-repeat !import ...

  9. CSS中background样式的repeat和no-repeat

    自http://blog.sina.com.cn/s/blog_98eef7830101cv8t.html获取的知识,特此感谢. <!DOCTYPE html> <html lang ...

随机推荐

  1. 一个在浏览器端将html 转为pdf 的js 插件 jsPDF

    <!DOCTYPE html> <html> <head> <title>test</title> <meta http-equiv= ...

  2. Python学习笔记——基础篇【第六周】——shutil模块

    常用模块之shutil 高级的 文件.文件夹.压缩包 处理模块 shutil.copyfileobj(fsrc, fdst[, length]) 将文件内容拷贝到另一个文件中,可以部分内容 def c ...

  3. Two Pointers - leetcode [两指针问题]

    125. Valid Palindrome consider only alphanumeric characters and ignore cases. transform(s.begin(), s ...

  4. JQuery笔记(三)选项卡

    通过jq封装的方法,可以更简单的制作一个选项卡 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  5. ios9 新关键字 __kindof 等(etc) 小结

    首先__kindof:规定参数为UITableViewCell(举例)这个类或者其子类.比如说一个NSArray<UIView *>*,如果不加__kindof,这个数组只能有UIView ...

  6. log4j配置示例

    在配置文件中按包名或类名来定义Logger 在程序中按类名取Logger 定义: log4j.rootLogger=debug,stdout log4j.logger.com.mypkg=debug, ...

  7. HDU - 3966 Aragorn's Story(树链剖分入门+线段树)

    HDU - 3966 Aragorn's Story Time Limit: 3000MS   Memory Limit: 32768KB   64bit IO Format: %I64d & ...

  8. GitHub常见错误解决办法

    如果輸入$ git remote add origin git@github.com:djqiang(github帳號名)/gitdemo(項目名).git 提示出錯信息:fatal: remote ...

  9. Apache环境服务器配置Let's Encrypt免费SSL证书及自动续期方法

    如今越来越多的网站开始使用SSL证书,实现HTTPS网址形式,如果我们是英文网站更需要用到这样格式的HTTPS网址,因为根据谷歌搜索结果提示到如果用到SSL证书的在同等条件下排名结果是有靠前可能的.我 ...

  10. PostgreSQL学习手册

    事实上之前有很长一段时间都在纠结是否有必要好好学习它,但是始终都没有一个很好的理由说服自己.甚至是直到这个项目最终决定选用PostgreSQL 时,我都没有真正意识到学习它的价值,当时只是想反正和其它 ...