0
私は自分のサイトに基本的なブートストラップを使用しようとしていますが、何もしていません。 私は「ブートストラップ・サス」宝石をインストールし、custom.css.sassでCSSコードを書かれたが、何がサイト
ブートストラップ3がロードされていません
に変化がある。これは、custom.css.scssファイル
@import "bootstrap-sprockets";
@import "bootstrap";
/*universal */
html{
overflow-y: scroll;
}
body {
padding-top: 60px;
}
section{
overflow : auto;
}
textarea {
resize: vertical;
}
.center{
tent-align : center
}
.center h1{
margin-bottom : 10px;
}
/* topography */
h1, h2, h3, h4, h5, h6 {
line-height : 1;
}
h1 {
font-size : 3em;
letter-spacing : -2px;
margin-bottom : 30px;
text-align : center;
}
h2{
font-size : 1.7em;
letter-spacing : -1px;
margin-bottom : 30px;
text-align : center;
font-weight : normal;
color : #999;
}
p {
font-size : 1.1em;
line-height : 1.7em;
}
/* header */
#logo{
float : left;
margin-right : 10px;
font-size : 1.7em;
color : #fff;
tex-transform : uppercase;
letter-spacing : -1px;
padding-top : 9px;
font-weight : bold;
line-height : 1;
}
#logo:hover {
color : #fff;
text-decoration : none;
}
これはapplication.htmlファイル
<!DOCTYPE html>
<html>
<head>
<title><%= full_title(yield(:title)) %></title>
<%= stylesheet_link_tag 'default', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'default', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"> </script>
<![endif]-->
</head>
<body>
<header class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<%= link_to "samples app", '#', id: "logo" %>
<nav>
<ul class="nav pull-right">
<li><%= link_to "Home", '#' %></li>
<li><%= link_to "Help", '#' %></li>
<li><%= link_to "Sign in", '#' %></li>
</ul>
</nav>
</div>
</div>
</header>
<div class="container">
<%= yield %>
</div>
</body>
</html>
であり、これはhome.htmlファイル
ですapplication.htmlで
application.css
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
* compiled file so the styles you add here take precedence over styles defined in any styles
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
* file per style scope.
*
*= require_tree .
*= require_self
*/
オブジェクトがこのメソッドをサポートしdoesnot（と、それは誤りを送っていたように私は（stylesheet_link_tag 'default'へstylesheet_link_tag 'application'）をchanagedと（javascript_include_tag 'application'javascript_include_tag 'default'に）しました）
ブラウザのdev toolsコンソールにエラーがありますか？ –
他のCSSファイルはありますか？ブラウザで生成されたソースを表示してCSSファイルを検索すると、何が得られますか？ 'custom.css'はまったく含まれていないかもしれません（' default.css'に依存します）。 もう1つの問題は、ファイル名を '.scss'ではなく' .css'にしたことかもしれません。 – wvengen
あなたにapplication.cssファイル –