Bootstrap Nav ist seltsam

Question

Ich habe einen blanken Knochen-Code, den ich gespeichert habe, so dass ich von dort starten kann, wenn ich eine Bootstrap-Site erstellen. Heute habe ich mit dem Responsive-Code für einen gearbeitet, an dem ich gerade arbeite, und die Nav-Leiste gibt mir auf mysteriöse Weise keinen transparenten Hintergrund. Ich testete es mit einem farbigen Hintergrund und es funktioniert, aber es gibt einen sekundären Hintergrund, der hellgrau bleibt. Ich kann nicht für das Leben von mir herausfinden, warum.

Hier ist ein Link zu der Website in Bearbeitung. Tut mir leid, es ist jetzt super unordentlich. http://dismantledesign.com/phantasm

Hier ist das CSS, das die Navigationsleiste in transparent ändern sollte. Ich kann nicht den Schuldigen finden, die Navigationsleiste grau zu halten.

@media(min-width:768px){ 
    .navbar-default .navbar-collapse{ background: none; border: none; } 
    .navbar-default .navbar-nav{ float: right; } 
    .navbar-default .navbar-nav>li{ margin-left: 20px; color: #fff; } 
    .navbar-default .navbar-nav>li>a{ color: #fff; } 
    .navbar-default .navbar-nav>li>a:hover{ color: #fff; } 
    .navbar-default .navbar-nav>.active>a, 
    .navbar-default .navbar-nav>.active>a:hover, 
    .navbar-default .navbar-nav>.active>a:focus{ color: #fff; } 
} 

Answer 1

Fügen Sie den folgenden Code hinzu. Wenn Sie .navbar-default css überprüfen, wird bereits eine Hintergrundfarbe angewendet, die #f8f8f8 ist, ändern Sie es in die transparente oder keine.

.navbar-default { 
    background-color: transparent ; 
} 

oder Sie können auch diese hinzufügen Es funktioniert gut

nav.navbar.navbar-default { 
    background-color: none; 
} 

Answer 2

Ich habe Ihre Komponente transparent gemacht, siehe

Sie sind nicht in der Lage Ihre Komponente transparent angezeigt werden, weil die Klasse, die Sie Verwenden Sie hat Hintergrundfarbe Eigenschaft auf # f8f8f8 (.navbar-Standard) festgelegt.

Ich empfehle Ihnen, die Hintergrundeigenschaft zu überschreiben, zum Beispiel background-color: # 000! Wichtig; durch Anwenden von CSS inline oder geben Sie der Komponente eine Klasse und dann die Hintergrundfarbe Ihrer Wahl und dann können Sie frei Opazität: 0.8 oder alles, was Sie wollen.

Ich hoffe, Sie bekommen es, lassen Sie mich wissen, wenn Sie stecken bleiben.