如何將我的一個 CSS 文件鏈接到不同文件夾中的所有 HTML 文件？

Question

我嘗試從父文件夾訪問 CSS 以使其成為唯一的 CSS 文件。 嘗試訪問它時出現錯誤。

GET http://localhost:3000/style.css net::ERR_ABORTED 404 (Not Found)

app.Static("/", "static/home")
# static/home has index.html
app.Static("/signup", "static/signup", #options)
# static/signup has signup.html

當我把它放在 app.Static 選擇的文件夾中時，我的app.Static工作正常。 但是我只想要 1 個 CSS 文件，我的所有 html 文件都可以訪問。 因此，我希望它位於 static 文件夾中，但由於某種原因，我的 HTML 文件無法訪問它。

<link rel="stylesheet" href="../style.css">
# Both files have this link tag

我猜問題是我錯誤地解決了問題並且 app.Static 在它選擇的文件夾之外看不到？

Answer 1

鏈接的href屬性應該是絕對路徑：

<link rel="stylesheet" href="/style.css" />

由於瀏覽器中加載的 HTML 文件的路徑以/signup開頭，因此相對資源路徑../style.css可能並不總是對/style.css的引用。

Answer 2

你正在嘗試做的是可能的。

假設這個結構：

├── main.go
└── static
    ├── home
    │   └── index.html
    └── style.css

您只需要將./static設置為根文件夾。

app.Static("/", "static")

然后進入./static/home/index.html使用：

<link rel="stylesheet" href="../style.css" />

這樣做，您可以從 go 到http://localhost:3000/home並使用./static/style.css查看./static/home/index.html的內容。

Answer 3

我對 web 服務器的理解是錯誤的。 我認為每個文件都應該由app.Static ，但這只適用於單頁應用程序。

最好將您的 CSS/JS 保留在那里，以便您可以輕松地從標准路由上提供的 HTML 文件中調用它，如style.css 。