透明度到导航栏反转

我有导航栏反转，我需要有温和的透明度来显示我的导航栏位于我的背景图片上。我应用不透明度，为我的导航栏，但我无法实现轻度transperency.As我期望在图像附加在这里。透明度到导航栏反转

.logotitle { 
    width:30px; 
} 


.mynavStyle{ 
    height: 60px;!important 
} 

.navbar { 
background:grey;!important 
opacity: 0.6;!important 
    filter:alpha (opacity=10);!important 
} 

.coverphoto{ 
    background-image: url("cphoto.jpg"); 
    height: 369px; 
}

HTML：

<div class="coverphoto"> 
    <nav class="navbar navbar-inverse mynavStyle"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#"> <img class="logotitle pull-left" src="css/images/logo.png"></a> 
    </div> 
    <div class="collapse navbar-collapse" id="myNavbar"> 
     <ul class="nav navbar-nav"> 
     <li><a href="#">Find Talent</a></li> 
     <li ><a href="#">Find Job</a></li> 
     <li><a href="#">Find Hirer</a></li> 
     <li><a href="#">Find Talent/Casting Manager</a></li> 
     </ul> 
    </div> 
    </div> 
</nav> 
</div>

来源

2016-11-14 Nicoleta Wilskon

尝试，这

.navbar { 
     background-color: rgba(0,0,0,.6) 
    }

来源

2016-11-14 09:12:26 codeninja93

这是不正确的语法：

.navbar { 
    background:grey;!important 
    opacity: 0.6;!important 
    filter:alpha (opacity=10);!important 
}

它应该是：

.navbar { 
    background:rgba(0, 0, 0, 0.65); 
}

来源

2016-11-14 09:13:25 Stuart

只需设置RGBA背景：

.navbar { 
    background: rgba(0,0,0,0.5); 
}

来源

2016-11-14 09:13:37 emtei

.navbar { 
    background-color: transparent; 
    background: transparent; 
    opacity: 0.6;!important 
    filter:alpha (opacity=10);!important

}

试试这个

来源

2016-11-14 09:18:47

您应该使用背景透明度，而不是透明度，即”

.navbar{ 
    background: rgba(0,0,0,0.6); 
}

RGBA（）影响单个属性，如颜色，背景色或边框颜色，通过CSS，只有这些元素的

不透明针对性的一个元素会影响所有属性（整个展望）的目标元素以及所有他们的DOM树儿童

来源

2016-11-14 09:31:18 Chris

透明度到导航栏反转

回答

相关问题