刚刚碰到一个奇怪的问题，这样一段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. CodeForces 681D Gifts by the List

    $dfs$,后续遍历. 如果某个节点$a[i]=i$,那么$i$的后继的$a[i]$都要指向$i$,直到出现新的后继$j$,$a[j]=j$.利用这个可以判断是否有解. 如果有解的话,那么只要输出后序 ...

  2. Kostya the Sculptor

    Kostya the Sculptor 题目链接:http://codeforces.com/problemset/problem/733/D 贪心 以次小边为第一关键字,最大边为第二关键字,最小边为 ...

  3. 新Mac 开机启动MySQL/MongoDB/Redis 等服务

    在Mac上我们使用[homebrew]包管理工具(http://brew.sh/index_zh-cn.html)来安装和管理开发工具包,例如:mysql.php.redis.只需要一个命令 brew ...

  4. .Net 生成二维码【超简易，仅供学习】

    1,首先下载DotNetBarcode.dll文件 下载地址: http://dl.downyi.com/dotnetbarcode_dll.rar 2,调用方式 string path = @&qu ...

  5. vue对比其他框架

    对比其他框架 React React 和 Vue 有许多相似之处,它们都有: 使用 Virtual DOM 提供了响应式(Reactive)和组件化(Composable)的视图组件. 将注意力集中保 ...

  6. dplyr 数据操作 常用函数（4）

    接下来我们继续了解一些dplyr中的常用函数. 1.ranking 以下各个函数可以实现对数据进行不同的排序 row_number(x) ntile(x, n) min_rank(x) dense_r ...

  7. 怎么在ng-repeat生成的元素上操作dom

    这个问题其实对初学者来说,都 有这样的经历,用ng-repeat生成的元素用js怎么也获取不到;这个其中原由是:angular拥有自动化渲染DOM的特性,它能帮助我们专注于操作数据,而页面的渲染则由a ...

  8. 怎么 得到 DBGrid选中行的数据

    转自:https://zhidao.baidu.com/question/1694035814426308148.html 一般是你鼠标点到哪一行,其DataSet的指针就指到了什么位置你可以直接通过 ...

  9. JQUERY 轮播插件

    闲来无事,写个轮播插件,项目中用到的时候就无需在写了,不然会累死宝宝的 废话少说 代码上 html部分 <div class="lunbo"> <ul> & ...

  10. Mac Java maven环境变量

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo; color: #000000; background-color: #fffff ...