刚刚碰到一个奇怪的问题，这样一段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. 职责链模式(Chain of Responsibility)（对象行为型）

    1.概述 你去政府部门求人办事过吗?有时候你会遇到过官员踢球推责,你的问题在我这里能解决就解决,不能解决就推卸给另外个一个部门(对象).至于到底谁来解决这个问题呢?政府部门就是为了可以避免屁民的请求与 ...

  2. 第一百一十九节，JavaScript事件入门

    JavaScript事件入门 学习要点: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操 ...

  3. PAT乙级1034. 有理数四则运算(20)

    本题要求编写程序,计算2个有理数的和.差.积.商. 输入格式: 输入在一行中按照“a1/b1 a2/b2”的格式给出两个分数形式的有理数,其中分子和分母全是整型范围内的整数,负号只可能出现在分子前,分 ...

  4. Edward's Cola Plan

     Edward's Cola Plan Time Limit:3000MS     Memory Limit:32768KB     64bit IO Format:%lld & %llu S ...

  5. ES6（一）let const

    1.let 声明变量 let和var区别: let 只在变量声明时所在的代码块内有效 let不允许在同一作用域内重复声明变量 let不存在变量提升 const: 也是声明一个只读常量,一旦声明,常量的 ...

  6. Java Day03 面向对象程序设计

    1.面向对象 面向对象是指一种程序设计泛型,同时也是一种程序开发的方法. 2.类 类是一种抽象的概念,类中包含了数据与对数据的操纵. 具有相同特性(数据元素)和行为(功能)的对象的抽象就是类.类是对象 ...

  7. 兼容 console 没删除引起 低级浏览器 报错问题

    /*重写connsole.log,防止调试代码出错*/if (!window.console){ var names = ["log", "debug", &q ...

  8. jquery对象介绍及一些jquery小特效

    一.jquery对象的介绍. 引入jquery库后,通过形如$("#id")的方式得到的对象叫做jquery对象.如var $uu = $("#username" ...

  9. cxf 报错：java.lang.NoSuchMethodError: org.apache.ws.commons.schema.XmlSchemaCollection.read(Lorg/w3c/dom/Document;Ljava/lang/String;)

    由于没有仔细查看官方提供的文档,由jdk版本不一致导致的出错: http://cxf.apache.org/cxf-316-release-notes.html 自己使用的是jdk1.8. 报Exce ...

  10. 单词缩写（abbr.cpp）每日一题

    题目描述:YXY 发现好多计算机中的单词都是缩写,如 GDB,它是全称 Gnu DeBug 的缩写.但是,有时缩写对应的全称并不固定,如缩写 LINUX,可以理解为:(1)LINus's UniX ( ...