Я только хочу, чтобы мои кнопки навигационной панели были видны, в то время как фактическая панель, которая охватывает всю страницу, имеет полную непрозрачность. Всякий раз, когда я изменяю непрозрачность панели навигации, это влияет на классы внутри нее, даже когда я указываю, что эти классы не имеют прозрачности.

Мы разместили изображение того, что яЯ пытаюсь повторить. Как видите, ссылки отображаются полностью, но панель навигации невидима, что позволяет отображать полное фоновое изображение. Это может выглядеть как сплошная красная полоса, но я вас уверяю,Невидимый Навбар.

Любая помощь будет очень признательна! Благодарю.

Вот'HTML-код моей навигационной панели:

    
        
            
                <a 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>
                </a>
                <a class="brand" href="index.html">Homegrown</a>
            
                
                    <a href="index.html">Home</a>
                    <a href="index.html">About</a>
                    <a href="index.html">Contact</a>
                
            
            
        
    

Пока яя пытался редактировать мой CSS следующим образом:

ul .nav .nav-pills {background:rgba(255,255,255,0.5)}

.custom_nav {
    .navbar.navbar-fixed-top {
        background:rgba(255,255,255,.5);
    }
    .navbar .nav > .active a, .navbar .nav > .active a:hover, .navbar .nav > li a:hover {
        background:rgba(210,105,30, 0); text-shadow:none;
    }   
}