☰

Nginx 未应用 CSS 文件

tag-icon • tag-icon nginx html css
Nginx 未应用 CSS 文件

我在 Nginx 上使用动态模块“fancyindex”，并尝试将外部 css 文件加载到这些 fancyindex 页面中。以下是我的 sites-available 目录中的配置文件：

location /images/ {
            alias /var/www/test/public/images/;
            fancyindex on;
            fancyindex_css_href /etc/nginx/css/test.css;

使用“nginx -t”时没有出现任何错误，页面加载正确，但是 css 规范未应用，而是默认 fancyindex 外观仍然存在。FancyIndex 正在按预期查找 css 文件并将其编码到页面 html 中。当我查看页面源代码时，自动创建的列表之前包含以下内容：

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

我的“test.css”文件内容如下：

a, a:active {text-decoration: none; color: #41b5f4;}
a:visited {color: #41b5f4;}
a:hover, a:focus {text-decoration: underline; color: #f4ee41;}
body{
background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;

我对 Nginx 和 html 还比较陌生，所以我不确定问题到底出在哪里，是出在 css 文件中，还是网站配置中，还是其他什么地方。我尝试了几种不同的方法来写出 css 文件等，但都没有成功，所以我想在这里问一下。我还尝试过清除 Chrome 上的缓存。

答案1

作为文档对于fancyindex_css_href各州：

提供的乌里参数将按原样插入<link>HTML 标签中。

这意味着您提供的 URI 必须是绝对 URI 或相对 URI。由于您使用了相对 URI，因此您提供的路径是相对于文档的root。您应该更正路径、移动 CSS 文件，或者两者兼而有之。

相关内容