时间戳

首页 > 解决方案 > 代码/链接因我的计算机中的背景图像而失败

html - 代码/链接因我的计算机中的背景图像而失败

问题描述

我正在尝试使用照片（我从中复制路径）来制作我的背景图像。我之前使用相同的方法添加了一个图像来复制位置，它正在显示 up.background-image：

它在括号中变成蓝色。我是全新的，不知道该怎么做。任何帮助将不胜感激！

#body{
background-image: url(/Users/samanthagaiser/Basic_portfolio/assets/images/dot-grid.png);
}

当我在cs代码中“点击链接”时，它会点击到下一个我保存图像的窗口。

标签： htmlcss

解决方案

将图像、.CSS 文件和 .html 文件复制并粘贴到一个文件夹中。或者，如果您只有 .html 文件将图像复制到与 .html 相同的文件夹，则更改：

body{
    background-image: url('./dot-grid.png');
}

图像的路径必须相对于您加载它的文件。

下面的例子：

没有 1。

CSS:   /resources/css/styles.css  
Image: /resources/images/image.jpg

style.css 中的 CSS：

div { background-image: url('../images/image.jpg');

没有 2。

CSS:   /resources/css/styles.css
Image: /resources/css/image.jpg

style.css 中的 CSS：

div { background-image: url('./image.jpg');
  1. ./= 在 .css 文件所在的同一文件夹中查找图像。
  2. ../= 在 .css 文件所在的文件夹下查找图像。
  3. ../../=在.css文件下面寻找图像两个文件夹。

推荐阅读