Question

我正在与Angular开始一个新项目并面临一个问题。当我尝试使用<link>加载外部CSS文件时，它不起作用，但当我使用@import的内部样式时，它确实有效！

不适用于：<link rel="stylesheet" type="text/css" src="transmission.min.css">

适用于：<style>@import url('transmission.min.css');</style>

我的文件位于同一目录（应用程序的根目录）：

/
/index.html
/transmission.min.css
/transmission.min.js

我的CSS和JS文件被连接起来并用grunt缩小，但我尝试了没有它和相同的结果。

这是我的index.html文件：

<!doctype html>
<html>
<head>
    <title>Transmission</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" src="transmission.min.css">
    <style>
        @import url('transmission.min.css');
    </style>

    <base href="/">
</head>
<body ng-app="transmission">

    <div ng-view=""></div>

    <script src="transmission.min.js"></script>
</body>

我的CSS文件只包含body{background-color: red;}

我检查了两次nginx配置，一切似乎都很好。

我还使用Safari检查器检查过，我可以访问http://transmission.dev/transmission.min.css处的CSS文件。

但它没有出现在资源标签中。

此外，我的Angular应用程序加载完美。

如果您有任何想法？ :-D

谢谢

Answer 1

link标记使用href属性，而不是您指定的src。请更改并检查。

Answer 2

应该是

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

link代码使用href而非src

希望它有所帮助！

外部CSS文件未加载链接标记

2 个答案: