Question

我正在处理一个index.php文件，该文件保存在Wamp的htdocs文件夹中的6-php文件夹中。我正在尝试制作整页的背景图像。我从unsplash下载了一张图片，并将其另存为Wamp上6-php文件夹中的background.jpg。当我尝试使图像显示在http://localhost/6-php/index.php/中时，它没有打开。文字显示，只是没有打开图像。当我以http://localhost/6-php/打开它时，该图像显示出来，但是当我添加/index.php/时，该图片消失了，仅显示了文本。

我尝试从不同的站点下载不同的图像。我尝试将其保存在其他文件夹中。

html { 
      background-image: url(background.jpg) no-repeat center center fixed; 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }

我也只尝试了<img src="background.jpg">，没有结果。

我希望“ background.jpg”是index.php文件上的整页背景图像。

Answer 1

图像的路径很重要。共有2个optins提及图片的路径

path of image htdocs/project/images/background.jpg path of css htdocs/project/css/style.css path of index.php htdocs/project/index.php

相对路径图片的路径从尝试访问文件的基本文件开始

style.css

body { background-image: url('../images/background.jpg') }

index.php

<img src="../images/background.jpg">
绝对路径

图像的路径从htdocs文件夹
开始
style.css

body { background-image: url('/project/images/background.jpg') }

index.php

<img src="/project/images/background.jpg">

Answer 2

html { 
      background-image: url(background.jpg); 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="style.css">
    
    </head>
<body>
    

    
    </body>
</html>

如何在我的本地主机（WAMP）中打开图片

2 个答案: