如何使用 css 获取其他文件夹中的背景图像？

Question

伙计们，这是我的文件夹结构

项目

index.php
css

style.css
js

javascript.js
图片

background.jpeg

style.css

body{
background-image: url("image\background.jpeg");
}

index.php

<html>
<head>
    <title>Todo Application</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <div id = "header">
    hiuiiiii
    </div>
</body>
</html>

所以大家告诉我我哪里错了，以便我可以更正它以便显示我的背景图像。

Answer 1

我认为这是问题所在。

不正确 - url("image\background.jpeg");

正确 - url("../image/background.jpg");

../ - 这意味着向上一个目录给出图像位置，在您的情况下，它在图像目录中。

希望对您有所帮助。

Answer 2

这样试试：

background:url("../images/background.jpg") no-repeat;

或

background-image:url("../images/background.jpg");

在文件夹名称前使用 ../

Answer 3

它应该是这样的：

body {
     background-image: url("../image/background.jpeg"); }

这是一个非常常见的错误，即使对我来说也是如此。您需要双点返回一个文件夹，因为您的样式表位于 css 文件夹内，而您的背景位于图像文件夹内。此外，一旦你修好了，你就可以使用

在后面完美对齐它

background-size: cover;

..加上前缀，它看起来像这样。

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;

我希望这能回答你的问题。

Answer 4

URL 在 CSS 中是相对于包含 CSS 文件的目录的。如果您的文件位于根目录中，那么您的 URL 就是正确的。但是，由于它位于您要使用的图像的 "sibling" 目录中，因此您需要向其添加 / 或 ../。此外，网络上的 URLs 始终使用正斜杠 / 而不是反斜杠 \.

body{
    background-image:url("/image/background.jpeg");
}
body{
    background-image:url("../image/background.jpeg");
}

Answer 5

好的，我在本地尝试你的问题时遇到了同样的问题。但是现在，我让它像这样工作。

CSS:

body{
background: url("../image/background.jpg");
}

HTML:

<head>
    <title>Todo Application</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <div id = "header">
    hiuiiiii
    </div>
</body>
</html>

希望对您有所帮助。

Answer 6

希望这对您有所帮助：url("../image/background.jpg");

如何使用 css 获取其他文件夹中的背景图像？

how to get background image present in other folder using css?

html

css

external

background-image