背景图像路径在 CSS 中不起作用

2024-03-06

相对路径在 CSS 中不起作用,尽管它是正确的

{ width: 64px; background: url(../images/abc/xyz/bottom-navigation.jpg) no-repeat 0 0; }

萤火虫给出这个错误

Folder path enter image description here


在 CSS 中,路径是相对于样式表的,因此请确保路​​径正确。根据您发布的代码,您的样式表需要位于一个文件夹中(例如css)并且该文件夹将与以下目录处于同一目录级别images.

另一种通常更好的选择是使用相对于您的域的路径。因此,如果图像文件夹位于根目录中,您将使用url("/images/abc/xyz/bottom-navigation.jpg")(请注意,在 CSS 中将文件名引起来是一个很好的做法)。

另一种可能性是加载图像时出现某种问题。在 Firebug 中,您应该能够右键单击 URL 并打开图像。执行此操作并确保它加载并显示正确的路径。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

背景图像路径在 CSS 中不起作用 的相关文章

  • 将 SVG 元素放置在图像上

    是否可以拥有以下元素并设置它们的样式 以便 SVG 对象出现在图像上 即像图像的一部分 目前它们显示在其下方的新行中 我知道我可以将图像设置为父 div 的背景图像 但不幸的是我还需要能够在父级内旋转它 所以我认为这不是一个选项 div s
  • 如何将 twitter bootstrap 与 Spring MVC 一起使用

    我不明白为什么我的 Spring MVC 页面没有隐藏引导样式 我的你好 jsp
  • CSS 双边框,外边框比内边框粗

    在我目前的工作中 我需要在容器上生成双边框 边框样式 双 实现这一点 但是我的客户希望外边框更厚 内边框具有正常厚度 除了创建 2 个 div 其中 1 个嵌套在另一个 div 中 外部 div 具有更大的厚度 或者通过使用边框图像 还有什
  • 如何使用滚动条图像?

    如何使用 HTML CSS 替换滚动条的图像 I have scrollbar base color 00acee scrollbar dark shadow color 00acee scrollbar track color fffff
  • 如何设置 jQuery 可拖动的最小/最大左和最小/最大右

    我复制了一份JSbin来练习 JSbin链接在这里 https jsbin com gififikisa edit html css js output 实际站点链接在这里 http 79 170 40 181 emory com Proj
  • 停止 CSS 动画但让其当前迭代完成

    我有以下 HTML div class rotate div 以及以下 CSS webkit keyframes rotate to webkit transform rotate 360deg rotate width 100px hei
  • 具有宽度/高度的 SVG 在 IE9/10/11 上无法缩放

    IE 9 10 11 存在一个已知问题 如果您有一个 SVG 文件
  • 是否可以使用纯 css 禁用 mat-tab 动画

    我想禁用 Angular Material mat tab 动画 内容滑入到位时发生的动画 我知道可以使用 disabled 属性 但我想知道是否可以使用纯 css 达到相同的效果 EDIT 我们的用户体验团队希望从材质选项卡中删除幻灯片动
  • 如何用css3和html5制作不规则形状的div?

    我想知道是否有可能构建具有不规则形状的 div 类似于此 例如格陵兰岛 欧洲 非洲 我想使用 CSS3 和 HTML5 创建像这里这样的地图 以下是示例图像的链接 你所拥有的看起来像一个网格 你可以通过一个 div 上的许多渐变来获得它 也
  • contenteditable 在 safari 中不起作用,但在 chrome 中起作用

    我有一个奇怪的问题 这在 chrome 中按预期工作 但在 safari 中它只会发光 但不会对按键输入做出反应 这是触发文本版本的方法 var namebloc event currentTarget find column filena
  • 为什么响应式图像需要“高度:自动”?

    是否有必要定义height auto现在 原因是什么 img max width 100 height auto Thanks 在没有明确设置高度尺寸的图像上 它实际上默认为自动高度 所以如果你设置max width 100 高度将由浏览器
  • 自动调整元素 (div) 大小以适合水平内容

    我尝试谷歌搜索 但没有得到太多结果 我正在构建一个水平轮播 它在浮动的 LI 中显示图像 我想解决的问题是 每次我向轮播添加缩略图 我是延迟加载 时 我都需要重新计算轮播的宽度 以便所有浮动缩略图很好地并排排列 其一 我宁愿不必在 JS 中
  • Ie11 不应用媒体查询样式

    IE11 忽略我的媒体查询并始终使用移动 CSS 奇怪的是 如果我改变浏览器宽度 即使只是 1 2 像素 浏览器也会自行渲染并显示媒体查询 我尝试了 css lint 我的 css 中没有错误 我的CSS没有什么特别的 只是简单的 css
  • 检查元素是否在视口的 30% 到 60% 之间

    我正在尝试改变颜色 li 当元素占视口的 30 到 60 之间时 所以我有这个元素网格并排堆叠 如下所示 我遇到了一些插件 例如 Waypoints Viewport Checker 和其他一些插件 但没有什么好的 任何想法 我正在使用一个
  • 列表的 CSS 计数器

    我正在尝试在我的有序列表上使用 css 中的计数器增量 但它不起作用 这就是我想要显示的内容 1 Acknowledgements 1 1 blah blah 1 2 blah blah 1 3 blah blah 2 Risk State
  • HTML 表格信息

    我想知道是否有任何方法可以使 html 中的表格看起来像这样 http i43 tinypic com 21dml8l png http i43 tinypic com 21dml8l png 我基本上需要第一列中的 1 个大单元格 然后第
  • CSS:响应式布局中的高度自动问题

    我在响应式布局中使用 jquery 延迟加载 并使用空白 gif 作为预览图像 为了使延迟加载工作 我必须通过属性设置图像的高度和宽度 预览图像未设置为正确的高度 因为 height auto 似乎是通过 src 而不是通过高度属性计算高度
  • 背景大小不起作用

    这是我的 CSS banner text BG background 00A7E1 url images sale tag png left center no repeat important background size 20px 2
  • 如何在rollup中使用css @import?

    我尝试创建一个简单的汇总应用程序的配置 但在 css 方面遇到了一些麻烦 这是我的 CSS 文件 import normalize css import typeface roboto html body root height 100 f
  • javascript初学者:在javascript中添加动态样式? [复制]

    这个问题在这里已经有答案了 可能的重复 如何使用 Javascript 创建 标签 https stackoverflow com questions 524696 how to create a style tag with javasc

随机推荐

  • 正确的向量内存管理

    我正在制作一个游戏 我有一个子弹飞来飞去的矢量 当子弹完成后 我执行Bullets erase bullets begin i 然后子弹就消失了 然而它似乎并没有失去记忆 如果我创建 5000 颗子弹 然后在它们消失后再创建 5000 颗
  • @Mock 和 @InjectMocks 之间的区别

    有什么区别 Mock and InjectMocks在 Mockito 框架中 Mock创建一个模拟 InjectMocks创建类的实例并注入使用创建的模拟 Mock or Spy 注释到此实例中 注意你必须使用 RunWith Mocki
  • C# 中带有附加行的十字准线光标

    如何在屏幕截图上制作带有帮助线的十字准线光标 我知道如何制作十字光标 this Cursor System Windows Forms Cursors Cross 也可以是这样的 就像在 CAD 软件中一样 这是我使用的代码 x 和 y 是
  • 适用于 Android 的“实时”内存分析工具

    是否有适用于 Android 的 实时 内存分析器工具 类似于 XCode 中的 Instruments 大多数对内存分析的搜索都会引导我使用内存分析器工具 这很棒 但我非常感谢一个可以动态显示哪些类在应用程序的生命周期中消耗 和释放 内存
  • React:如何对渲染的组件的变化进行动画处理?

    我更改了通过时间间隔呈现的组件 我希望能够在每次发生变化时添加动画 最好的方法是什么 constructor props super props this state currentComponent 1 numberOfComponent
  • 将服务引用添加到 WP8 应用程序时出现问题

    我尝试添加服务引用http www webservicex com globalweather asmx WSDL网络服务 我转到 添加服务引用 它发现它很好 但是当我尝试单击 确定 时 出现错误 无法签出当前文件 该文件可能是只读的或锁定
  • JavaFX并发任务设置状态

    我正在为我的应用程序创建 UI 该应用程序与其他平台的版本共享核心模块 在JavaFX中 我尝试使用Task http docs oracle com javafx 2 api javafx concurrent Task htmls 在后
  • PHP 基于当前文件路径动态包含

    我想找到一种方法来包含基于当前文件路径的一些文件 例如 我有 website com templates name1 index php 这个 index php应该是一个独特的文件 我将在不同深度的许多不同目录中使用它 所以我想让代码通用
  • 如何使用数字字符实体而不是问号将 XmlDocument.Save() 编码为“us-ascii”?

    我的目标是获得一个二进制缓冲区 MemoryStream ToArray 会产生byte 在本例中 的 XML 且不会丢失 Unicode 字符 我希望 XML 序列化程序使用数字字符引用来表示任何在 ASCII 中无效的内容 到目前为止
  • 在node-sqlite3中使用Gyp中的共享库

    我是吉普新手 我不想编译我的依赖项 而是想使用共享库 特别是我的计算机上已有的 libsqlite3 so 主要的 binding gyp 目前看起来像 targets target name node sqlite3 sources sr
  • 国际键盘上常用字符的键码

    好的 从特殊符号捕获按键代码会在不同布局的键盘上产生不同的结果 但是像 a z 这样的 常见 字符呢 如果您有 QWERTY 键盘 您将获得按键代码81当你输入时q 当您拥有 AZERTY 键盘时 您会获得代码吗81当你按a since a
  • 在 HttpModule 中重写 URL 时如何使波形符 (~) 运算符起作用?

    我在用重写路径 http msdn microsoft com en us library 1kz7fdx9 aspx in an IHttpModule 路由 到子 Web 应用程序 如以下 IIS 布局所示 例如 当请求 根 布莱赫进来
  • 修改并重新编译Android SDK

    我知道Android中实现的一些方法和一些类没有导出到Android公共SDK中 我已经能够通过编译我的应用程序并将其放置在 Android 树中来创建一个使用其中一些功能的应用程序 是否可以通过从源代码重新编译这些函数来将其导出到 And
  • 如何将一个数组输入与另一个数组输入关联起来?

    假设我有 2 个扫描仪填充的阵列 name and age 每一项都按顺序填写 如果我要找到数组中最年长的人 如何使用数组打印出他们的名字和年龄 例如最大的条目age was 78 有没有办法将其与name 数组来打印它 参考代码 publ
  • 当元素有多个类时,jquery 按特定类查找元素

    所以我正在做一些后端团队在构建时没有经过深思熟虑的事情 这给我留下了一个充满 div 的文档 我正在做的是从我需要单击的元素回滚 获取父容器 然后在父容器中找到一个元素class alert box warn class alert box
  • 在自定义损失函数中重塑张量

    我有一个类似的问题这个问题 https stackoverflow com questions 43056512 reshape tensorflow tensor inside keras loss function 我正在尝试在 ker
  • 使用 WorkflowServiceHost 进行 WF4 工作流版本控制

    相关这个问题 https stackoverflow com questions 2064518 loading persisted workflow after workflowdefinition has changed in wf4
  • Android:ListAdapter 示例重绘相同内容

    我使用此示例中的 ListAdapter http code google com p au optimizing layouts 201 source browse au optimizinglayouts src com example
  • 显示在 SQL Management Studio (2008) 中为表创建命令

    我刚刚开始使用 SQL Management Studio 我想知道是否可以显示现有表的创建命令 我已经能够在 Oracle SQL Developer 中做到这一点 我试图问 google 叔叔 但可能只使用过错误的搜索命令 无论如何 有
  • 背景图像路径在 CSS 中不起作用

    相对路径在 CSS 中不起作用 尽管它是正确的 width 64px background url images abc xyz bottom navigation jpg no repeat 0 0 萤火虫给出这个错误 Folder pa