2012-04-22 26 views
0

我有一個根文件夾中的css文件,它涉及裏面的文件,相對於它的路徑。CSS樣式表路徑,堅持到文件本身的位置?

例如一個文件夾中與image.png沿stylesheet.css中,召喚如下:

background-image:url('image.png'); 

當我將其附加到index.html作爲以下:

<LINK rel="stylesheet" type="text/css" href="stylesheet.css"> 

.. 。它加載得很好,但如果想要將它附加到子文件夾的文件:

<LINK rel="stylesheet" type="text/css" href="../template_style.css"> 

...模板加載,但它實際上會在它啓動的html文件的文件夾中查找image.png,而不是從css文件本身的文件夾中查找。

有沒有解決這個問題?

回答

1

CSS相對路徑是相對於CSS文件本身而不是加載CSS文件的頁面。

我通常把我的CSS文件放在/ css和CSS的圖像放在/ css/images中。然後,你可以把你的形象比較像:

background-image:url('images/image.png'); 
+0

啊,我錯了。它是直接從我移動的HTML文件中調用的文件沒有加載,並且這些來自CSS模板的文件似乎加載正常。我只需要修復我的HTML文件。 Thankx! – Anonymous 2012-04-22 06:08:17

2

添加 <base href="http://www.example.com/">head

有了這個,你只需要添加:

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

如果是域或子域,如果你的CSS位於公共根文件夾(http://www.example.com/stylesheet.css

中,href需要爲
0
<link rel="stylesheet" type="text/css" href="../(supposed to be subfolders name)/template_style.css"> 

對於相同的圖像,如果在同一個文件夾中,請確保css和圖像都在相同的文件夾或相同的地方。

background-image:url("../image.png"); 

如果你製作一個單獨的圖片文件夾,它將會是格柵。

background-image:url("../folder name/image.png");