html - CSS 不再链接到特定文件夹

标签 html css angularjs relative-path

使用 angular-fullstack 生成器构建我的应用程序,我醒来时发现 CSS 不再链接到 2 个特定文件夹。检查 Chrome 控制台显示我的一个 css 文件确实没有正确链接,但我无法自行解决这个问题。

编辑:看来我的问题来自 index.html,因为我能够获得我的 css 的一部分。在这里:

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<base href="/">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<!-- build:css(client) app/vendor.css -->
  <!-- bower:css -->
  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">

  <!-- endbower -->
<!-- endbuild -->
<!-- build:css({.tmp,client}) app/app.css -->
<link rel="stylesheet" href="app/app.css">
  <!-- injector:css -->
  <link rel="stylesheet" href="app/account/account.css">
  <link rel="stylesheet" href="app/admin/admin.css">
  <link rel="stylesheet" href="app/app.css">
  <link rel="stylesheet" href="app/main/main.css">
  <link rel="stylesheet" href="bower_components/superhero/css/compiled/layout.css">
  <link rel="stylesheet" href="bower_components/superhero/css/compiled/elements.css">
  <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.css">
  <link rel="stylesheet" href="bower_components/superhero/css/libs/font-awesome.css">
  <link rel="stylesheet" href="app/work/work.css">
  <!-- endinjector -->
<!-- endbuild -->

我不明白为什么它现在可以工作,因为 main/main.html 正确使用了 layout.css 尽管也没有调用该文件。无论如何,字体没有链接,但我很确定它们是正确的。

///编辑结束

every html file from account and admin folders are unstyled except what is declared in account.css. If I copy the missing CSS in this file, everything is back to normal.

account 和 admin 文件夹中的每个 html 文件都没有样式,除了在 account.css 中声明的内容。如果我复制此文件中丢失的 CSS,一切都会恢复正常。

对我来说最奇怪的事实是,任何调用 components/navbar/navbar.html 的 account/*.html 文件也不会被正确打印,而它在任何其他 include 中工作正常。

这些文件夹的特殊性在于它们有 account.js 和 admin.js,它们包含自己的 stateprovider。

angular.module('yoyo')
  .config(function ($stateProvider) {
    $stateProvider
    .state('login', {
    url: '/login',
    templateUrl: 'app/account/login/login.html',
    controller: 'LoginCtrl'
  })
  .state('signup', {
    url: '/signup',
    templateUrl: 'app/account/signup/signup.html',
    controller: 'SignupCtrl'
  })
  ....

无论如何,如果我将代码放在包含所有其他状态的 work.js 中,它也不起作用。也不会将每段代码都放到应用文件夹中。

最后,我在理解生成器时遇到了很多麻烦,因为它不允许我将我的一些 CSS 链接到 index.html 文件中。或者它试图重写我提供的路径。我所知道的是昨天它在工作,我认为我没有推送任何相关代码,并且主文件夹包含与帐户文件夹中的任何 html 文件完全相同的 css。

谢谢!

最佳答案

问题出在相对路径上,尝试在开头使用斜线使用绝对路径。

<link rel="stylesheet" href="/app/app.css">
                             ^^
etc.

关于html - CSS 不再链接到特定文件夹,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27877602/

相关文章:

html - 内联 HTML/CSS 中的粗体数字

jquery - 你能用 CSS 和 jQuery 创建 "conjoined rectangles"吗?

css - 背景图片不工作

html - Div 仅在其中包含某些内容时可见

javascript - 是否可以更改光标的形状和大小?

html - Bootstrap 3中如何为不同的设备设置不同的列

html - 如何使div中的文本不超出其宽度

Javascript:for循环获取数据但顺序被破坏

html - Angular Material 布局对齐 = "center center"不工作

javascript - 带有指令的 AngularJS 动态表单字段 ID 不起作用