Ich versuche einige grundlegende Bootstrap auf meiner Website zu verwenden, aber es tut einfach nichts. Ich habe den 'Bootstrap-Sass' gem installiert und den CSS-Code in custom.css.sass geschrieben, aber es gibt keine jede Änderung der Website
Bootstrap 3 wird nicht geladen
diesem Zusammenhang die custom.css.scss Datei
@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;
}
ist
Dies ist die application.html Datei
<!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>
und dies ist die home.html Datei
<div class="center jumbotron">
<h1>Welcome to the Sample App</h1>
<h2>
This is the home page for the
<a href="http://railstutorial.org/">Ruby on Rails Tutorial</a>
sample application.
</h2>
<%= link_to "Sign up now!", '#', class: "btn btn-large btn-primary" %>
</div>
<%= link_to image_tag("rails.png", alt: "Rails"), 'http://rubyonrails.org/' %>
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
*/
In application.html
ich die (stylesheet_link_tag 'application'
zu stylesheet_link_tag 'default'
) chanaged haben und (javascript_include_tag 'application'
zu javascript_include_tag 'default'
), da es als einen Fehler sendete (Object doesnot diese Methode Unterstützung)
Alle Fehler in Ihrer Browser-Dev Tools-Konsole? –
Haben Sie andere CSS-Dateien? Wenn Sie die generierte Quelle im Browser anzeigen und die CSS-Datei nachschlagen, was bekommen Sie? Es kann sein, dass 'custom.css' nicht enthalten ist (abhängig von' default.css'). Ein anderes Problem könnte sein, dass Sie Ihre Datei '.css' anstelle von' .scss' benannt haben. – wvengen
posten Sie bitte application.css Datei –