Transparente Bootstrap-Navigationsleiste

8

Ich versuche, die Navigationsleiste so transparent wie zu machen . Aber ich kann es nicht zur Arbeit bringen. Ich habe rga (0,0,0,0,5) in der Navbar-Klasse hinzugefügt.

    
moosilauke18 09.05.2013, 02:48
quelle

4 Antworten

13

Ich habe es gerade herausgefunden. Für alle, die das in Zukunft brauchen. Ich habe einen CSS-Override hinzugefügt, der war:

%Vor%

Und meine HTML-Syntax sieht so aus:

%Vor%     
moosilauke18 09.05.2013, 03:13
quelle
6

Sie können sogar so verwenden

%Vor%

oder

%Vor%

Sie erhalten einen transparenten Hintergrund.

    
viswanath608 06.07.2015 11:26
quelle
3

Zuerst denke ich, dass Sie die falsche Syntax für RGB oder RGBA haben, die Sie geschrieben haben

%Vor%

Eigentlich sollte es

sein %Vor%

Nehmen wir das als Beispiel:

HTML

%Vor%

CSS

%Vor%

Ich würde auch vorschlagen, eine Fallback-Farbe zu haben, nur für den Fall, dass die Browser-Leute es nicht unterstützen.

CSS-Fallback

%Vor%     
lozadaOmr 18.09.2013 07:17
quelle
1

Für eine transparente Navigationsleiste ist es ziemlich einfach. Im CSS-Dokument können Sie eines von drei Dingen tun.

A. Der einfache Weg, aber Sie lernen nicht zu viel mit dieser Methode. Sie können das CSS-Dokument buchstäblich eingeben, dass der Hintergrund der Navigationsleiste transparent ist. Ziemlich einfach:

%Vor%

B. Sie können den Alphakanal für die RGBA-Hintergrundfarbe indirekt auf einen Wert zwischen 0 und 1 setzen. Die R-, G- und B-Koordinaten steuern jeweils das Rot, Grün und Blau der Pixel. Der A- oder Alpha-Kanal steuert die Deckkraft / Transparenz. Für R, G und B können Sie einen Wert zwischen 0 und 255 eingeben. Für den A-Alpha-Kanal müssen Sie jedoch einen Wert zwischen 0 und 1 eingeben. 1 bedeutet, dass es vollständig undurchsichtig ist (nicht transparent, aka vollständig sichtbar), und 0 bedeutet, dass es vollständig transparent (unsichtbar) ist. Wenn Sie unterschiedliche Werte für den Alphakanal festlegen, können Sie entscheiden, wie transparent Ihre Navigationsleiste sein soll. Sehr nützlich, wenn Sie die Navigationsleiste zu einer feststehenden machen und auf Ihrer Webseite unterschiedliche Hintergrundfarben haben.

Oh, und von Farben sprechen ... es gibt mehr.

Sie können einen Schritt weiter gehen. Wenn Sie möchten, dass Ihre Navigationsleiste transparent und hell / weiß ist, können Sie Folgendes tun:

%Vor%

Wenn Sie möchten, dass Ihre Navigationsleiste transparent und dunkler ist, können Sie Folgendes tun:

%Vor%

Wenn Sie nun Ihrer transparenten Navigationsleiste z. B. einen grünen Farbton geben wollen, dann machen Sie sich mit dem grünen Wert von G herum! Für rot, rum mit dem R-Wert. Für Blau, verwirren Sie mit dem B-Wert herum. Für ein Hexgrün von # 008f00 oder (0,143,0) in RGB wäre das etwa so:

%Vor%

Hoffe, das hilft!

    
Rishi 08.08.2017 00:08
quelle

Tags und Links