2017-03-22 13 views
0

Frage 1Wie kann ich die Deckkraft einer Hintergrundfarbe ändern?

Ich frage mich, ob jemand kann mir die Opazität der Drop-Down-Hintergrundfarbe ändern helfen, wenn der Benutzer über sie auf der Bar nav schwebt? Ich habe versucht, andere Tutorials anzuschauen. Ich hatte jedoch kein Glück.

Hier ist mein Code

.navbar.navbar-default ul li:after { 
     content: ''; 
     position: absolute; 
     right: 50%; 
     bottom: 0; 
     left: 50%; 
     height: 3px; 
     background-color: #FFFFFF; 
     border-radius: 9px; 
     transition: all .2s; 
    } 

    .navbar.navbar-default ul li a:hover { 
     color: white; 
    } 
+3

Bitte prüfen, wie ein [MCVE] erstellen. Das ist viel Code, von denen die meisten nichts mit Ihrer Frage zu tun haben. Das wird es einfacher machen, genau zu verstehen, wovon du sprichst. –

+0

Mögliches Duplikat von [CSS-Deckkraft nur zur Hintergrundfarbe und nicht zum Text?] (Http://stackoverflow.com/questions/5135019/css-opacity-only-to-background-color-not-the-text-on -it) –

+0

@MichaelCoker Vielleicht, wenn bestimmte Leute nicht springen würden, um sie zu beantworten ...;) –

Antwort

1

Verwenden rgba() Ihre Hintergrundfarbe einzustellen.

Statt hex, nimmt rgba einen rot, grün, blau und Durchlässigkeitswert, etwa so:

background-color: rgba(20, 50, 40, 0.5)

die RGB-Werte sind 0 bis 255, Opazität 0 bis 1.

Sie können Websites wie folgt verwenden: http://www.colorhexa.com/4f5f4f, die Ihnen helfen, Hexadezimalwerte in rgb-Werte zu konvertieren.

CSS unterstützt leider keine Alpha-Werte in Hex-Farben.

0

Sie können einfachen Add unten CSS Linien

.navbar.navbar-default ul li a:hover { 
    color: white; 
    background: rgba(61, 63, 74, 0.8); 
} 
Verwandte Themen