html cssが読み込めない

Question

htmlにcssファイルをいくつか読み込ませたいのですが、application.scssしか読み込まれなくて困っています。

application.scssは、

// Custom bootstrap variables must be set or imported before bootstrap.
@import "bootstrap";
//= require bootstrap
//= require_tree .
/*

htmlのhead内には

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

example.cssの位置はassets/stylesheets/example.css

以上なのですがどうしたらexample.cssが読み込めるでしょうか？

参考になるかはわかりませんが、larouts/application.html.erbに
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
があります。
あとbootstrapのgemも入っています

application.scssの中身は反映されています。何かわかる方いましたら宜しくお願いします。

Comments

[k_fujimoto]

htmlとcssの階層構造を追記してください。<link rel="stylesheet" type="text/css" href="example.css">←このパスがあやまっている可能性があります。ちなみにソースコードは、質問入力/編集画面の<code>ボタンで囲むと見やすくなり、回答が得られやすくなると思いますよ！

Answer 1

多分ですが、アクセスパスを細かく書いてあげればいいと思います。
なお、そのcssファイルをhtmlファイルと同じフォルダに入れると読み込める可能性が高くなると思います。

<link rel="stylesheet" type="text/css" href="assets/stylesheets/example.css">
<!--このassets...は例です。入っているフォルダ等に合わせて変更してください。-->

Answer 2

表示させるHTMLファイルからみて、適用したいCSSファイルのパス指定が正しくないと適用されません。

「cyan-drop」さんの回答のとおり、「絶対パス　相対パス」等で検索すると色んな説明サイトが出てきますので、理解しやすいサイトを探してみてください。

参考：
これだけは覚えておきたい！絶対パスと相対パスの違いとは