我使用bootstrap，我的html文件中有一个导航栏，我想让这个导航栏透明显示背景图像。有人可以教我如何用css做这个？我尝试以下css没有发生
.navbar-inner {
background-color:transparent;
}
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="#">lol</a>
<div class="nav-collapse collapse">
<ul class="nav pull-right">
<li class="active"><a href="/">Home</a></li>
<li><a href="about">About</a></li>
</ul>
</div>
</div>
</div>
</div>
解决方法
通过向.navbar添加一个新的.transparent类并设置CSS，我可以使导航栏透明。
.navbar.transparent.navbar-inverse .navbar-inner {
border-width: 0px;
-webkit-Box-shadow: 0px 0px;
Box-shadow: 0px 0px;
background-color: rgba(0,0.0);
background-image: -webkit-gradient(linear,50.00% 0.00%,50.00% 100.00%,color-stop( 0%,rgba(0,0.00)),color-stop( 100%,0.00)));
background-image: -webkit-linear-gradient(270deg,0.00) 0%,0.00) 100%);
background-image: linear-gradient(180deg,0.00) 100%);
}
我的标记是这样的
<div class="navbar transparent navbar-inverse">
<div class="navbar-inner">....
