無法找到CSS背景的正確相對路徑

我正在學習HTML和CSS。我得到了有關CSS背景圖像相對路徑的問題。當我使用相對路徑時，CSS下的背景圖像代碼不顯示圖像。無法找到CSS背景的正確相對路徑

我正在使用ATOM代碼編輯器。這裏是我的HTML文件中的CSS鏈接代碼。

<link href="resources\css\style.css" rel="stylesheet" type="text/css">

我嘗試幾種相對路徑，都不起作用

background-image: url('resources\building.png');
background-image: url('\resources\building.png');
background-image: url('boardway\resources\building.png');
background-image: url('\boardway\resources\building.png');
background-image: url('C:\Users\michael\gitprojects\boardway\resources\building.png');

boardway是resources的父目錄。 C:\Users\..\..是圖像的絕對路徑。所有五個地址都不起作用。

但是當我使用AWS地址是

background-image: url('https://s3.amazonaws.com/codecademy-content/programs/freelance-one/broadway/images/the-flatiron-building.png');

背景圖象被顯示正確。所以至少我可以確定我的代碼是正確的。但是我沒有輸入正確的相對路徑。我可以做什麼？

來源

2017-05-27 CHNimitz

1）where path html？ 2）路徑css在哪裏？ – Ehsan

CSS中的相對路徑與你的CSS文件相關，如果你想在層次結構中向上走，你可以使用點。所以如果你的圖像在'C：\ Users \ michael \ gitprojects \ boardway \ resources \ building.png'，你的css在'C：\ Users \ michael \ gitprojects \ boardway \ css \ styles.css'中，那麼你的相對路徑將是'../ resources/building.png' – ippi

可能重複。 https://stackoverflow.com/questions/20047364/how-to-give-the-background-image-path-in-css – AdhershMNair

你應該把/所有網址的

url('resources/building.png');

Please read about URLs

來源

2017-05-27 03:02:17 AvrilAlejandro

感謝您發佈的鏈接。我終於找到了問題所在。我認爲CSS文件不知道基本/絕對URL在哪裏。爲什麼相對路徑不起作用。我將我的圖像位置更改爲C：\ Users \ michael \ gitprojects \ boardway \ resources \ css \ images。相對路徑'images/building.png'工作順利 – CHNimitz

有2種方法用於定義文件/圖像路徑/ JS/CSS等

使用絕對路徑

2.使用相對路徑

下面是幾個例子

相對路徑[1]

index.html 
/graphics/image.png 
/help/articles/how-do-i-set-up-a-webpage.html

絕對路徑

http://www.example.com 
http://www.example.com/graphics/image.png 
http://www.example.com/help/articles/how-do-i-set-up-a-webpage.html

[閱讀全文]問題與你爸ths 1.使用正斜槓而不是反斜槓。 2.切勿鏈接本地系統的文件（服務器上的路徑可能有所不同）。

嘗試按照上述相應地進行更改。

Background-images:URL(../resources/building.png);

來源

2017-05-27 03:03:10

如果你不解釋它，或者至少解釋你所做的假設，那麼你的答案是沒有用的。 – ippi

@ippi我編輯了我的答案。 –

謝謝你的幫助。我終於找到了問題所在。我認爲CSS文件不知道基本/絕對URL在哪裏。爲什麼相對路徑不起作用。我將我的圖像位置更改爲C：\ Users \ michael \ gitprojects \ boardway \ resources \ css \ images。然後相對路徑'images/building.png'工作順利 – CHNimitz

無法找到CSS背景的正確相對路徑

回答

相關問題