瀏覽器未顯示圖像

Question

當我更改imag.Browser的路徑時不顯示圖像工作代碼

body {
background-image: url("D:\main.jpg");
background-repeat: no-repeat;
background-position : center;
background-attachment : fixed ;
}

相同的代碼，但是更改圖像的路徑不會在瀏覽器中顯示圖像。不起作用

body {
background-image: url("D:\Source_Code\HTML\Adventure Time\main.jpg");
background-repeat: no-repeat;
background-position : center;
background-attachment : fixed ;
}

Answer 1

您應該從當前的css文件而不是從計算機的根目錄提供url path 。 而且它是斜線而不是反斜線。

例如，如果您的css文件位於adventure-time目錄中，請執行以下操作： background-image: url("./main.jpg");

Answer 2

嘗試提供虛擬路徑而不是物理路徑。 例如background-image：url（“ / HTML / Adventure Time / main.jpg”）;

Answer 3

大多數url是相對的，是因為絕對url可以工作，盡管它們確實取決於操作系統。 對於可維護性而言，這是不希望的。

為了解釋一個相對URL（因為您的相對URL似乎對您有用），我舉了這個例子。 我將使用以下文件結構：

您的網頁位於./myWebsite/您的CSS位於./myWebsite/CSS中的頁面圖像位於./myWebsite/Images中

然后圖片的網址如下：

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

網址細分：

網址由簡單的不同部分組成。 第一部分是“ ./”。 這只是說些“父目錄”之類的話。

因此，此行代碼位於（./myWebsite/CSS/stylesheet.css）的文件的父目錄將是“ ./myWebsite/”。

然后下一部分是“ Images /”。 這意味着： “選擇文件夾“圖像””。

因此，現在我們導航到父目錄，然后選擇圖像所在的文件夾。 剩下要做的唯一一件事就是選擇圖像，這是通過指定其名稱和擴展名來完成的。 “ main.jpg”。

請記住，這是基本解釋