我的风格(CSS)
.navbar-default {
background-color: transparent;
border-color: transparent;
}
.navbar-default .navbar-brand {
color: #fed136;
font-family: "Kaushan Script", "Helvetica Neue", Helvetica, Arial, cursive;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:active,
.navbar-default .navbar-brand.active {
color: #fec503;
}
.navbar-default .navbar-collapse {
border-color: rgba(255, 255, 255, 0.02);
}
.navbar-default .navbar-toggle {
background-color: #fed136;
border-color: #fed136;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: white;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
background-color: darkblue;
}
.navbar-default .nav li a {
font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
text-transform: uppercase;
font-weight: 400;
letter-spacing: 1px;
color: white;
}
.navbar-default .nav li a:hover,
.navbar-default .nav li a:focus {
color: #fed136;
outline: none;
}
.navbar-default .navbar-nav > .active > a {
border-radius: 0;
color: white;
background-color: #fed136;
}
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
color: white;
background-color: #fec503;
}
.navbar {
background-color: transparent;
background: transparent;
border-color: transparent;
}
.navbar-inner {
background:transparent;
}
.navbar li { color: #000 }
@media (min-width: 768px) {
.navbar-default {
background-color: transparent;
padding: 25px 0;
-webkit-transition: padding 0.3s;
-moz-transition: padding 0.3s;
transition: padding 0.3s;
border: none;
}
.navbar-default .navbar-brand {
font-size: 2em;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.navbar-default .navbar-nav > .active > a {
border-radius: 3px;
}
.navbar-default.navbar-shrink {
background-color: #222;
padding: 10px 0;
}
.navbar-default.navbar-shrink .navbar-brand {
font-size: 1.5em;
}
}
我如何插入此CSS
<%= stylesheet_link_tag 'test' %>
这是路径:/assets/stylesheet/test.css
实际上这些代码是从以下模板复制的http://blackrockdigital.github.io/startbootstrap-agency/
但是我不知道为什么我的导航栏不透明
我正在使用与Ruby集成的bootstrap
安装Bootstrap GEM后,请确保将application.css
更改为application.scss
将您的样式放入app/assets/stylesheets/application.scss
您的application.scss
中可以@import test.css