Question

CSS中的正文部分没有显示背景图像。我尝试了各种各样的事情，比如背景：而不是css中的背景图像，我尝试了网址（＆＃34;路径＆＃34;）和网址（路径）和网址（../路径）和网址（＆＃34;（../路径），仍然没有任何帮助！

更新：我找到了各种解决方案我相信在我的css文件夹中创建一个名为images的文件夹使其更容易找到。此外，不使用\和使用/而不是。使用在线主机。谢谢你们。我很满意。

HTML：

<DOCTYPE! html>
<html>
<head>
<title>Hoola</title>
<link rel="stylesheet" type="text/css" href="C:\Users\Abdi\Desktop\CSS\Navigationfromleftstyle.css"/>
</head>
<body >
<div class="nav">
<ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">One</a></li>
    <li><a href="#">Two</a></li>
</ul>
</div>

</body>

</html>

Navigationfromleftstyle.css：

html{
    margin:0px;
    padding:0px;
    height:100%;
    width:100%;

}

body {

    max-height:100%;
    width:100%;
    margin:0;
    background:url("C:\Users\Abdi\Desktop\cartographer\cartographer\cartographerbig.png");
    padding:0;

}

.nav {

    width:100px;

}

Answer 1

您可以在网络服务器上托管您的图片。但是还有另一个很好的解决方案，你可以转到这个site并加载你的图像，然后获得该图像的css代码，这应该按你的意愿加载你的图像。它被称为base64编码。

如果你想从没有本地服务器的本地文件夹运行它，你应该像这样使用file：///关键字：

file:///C:/Users/Abdi/Desktop/cartographer/cartographer/cartographerbig.png

并注意您应该使用/而不是\

Answer 2

将所需图像保留在项目目录中并进行以下更改。

    <DOCTYPE! html>
<html>
<head>
<title>Hoola</title>
<link rel="stylesheet" type="text/css" href="C:\Users\Abdi\Desktop\CSS\Navigationfromleftstyle.css"/>
<style>
html{
    margin:0px;
    padding:0px;
    height:100%;
    width:100%;

}

body {

    max-height:100%;
    width:100%;
    margin:0;
    background:url("https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png");
    padding:0;

}

.nav {

    width:100px;

}
</style>
</head>
<body >
<div class="nav">
<ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">One</a></li>
    <li><a href="#">Two</a></li>
</ul>
</div>

</body>

</html>

<强>编辑：

让我们说你执行的页面是index.html。

如果你还没有创建任何目录，那么创建一个名为my_website的目录/文件夹（根据你的要求命名）并将index.html文件粘贴到my_website文件夹中。

现在在my_website文件夹中创建一个名为images的另一个文件夹，并将图像文件放在图像中

你的目录结构应该是这样的

body {

    max-height:100%;
    width:100%;
    margin:0;
    background-image:url("images\cartographerbig.png");
    padding:0;

}

Answer 3

您必须使用相对路径。比如：'http://www.google.com/images/1.png'

只需在css文件夹旁创建一个目录图像，然后将图像放在该文件夹中，就可以给出像

这样的正文路径

body {
max-height:100%;
width:100%;
margin:0;
background:url("../../images/Chrysanthemum.jpg");
padding:0;

}

这将有助于

Answer 4

试试这个。

body {
     background:url("img/01.png"); /*  location: root  */
     background:url("../../img/01.png"); /* location: outside your current folder */
     background:url("/website/projectname/gallery/img/01.png");   /* your localhost */
     background:url("http://www.thephotoargus.com/img/01.jpg");   /* external site */
     }

Answer 5

尝试替换网址background:url("C:\\Users\\Abdi\\Desktop\\cartographer\\cartographer\\cartographerbig.png"); http://validator.w3.org/#validate_by_input ＆＃34; \＆＃34;不应该使用＆＃34; /＆＃34;

Answer 6

Plz检查图像位置错误尝试使用一些在线图像并在css中插入

mvn install -Pci

CSS背景图片没有显示？

6 个答案: