2016-08-01 2 views
-1

Ich mache eine Navigationsliste, und ich frage mich, ob es eine Möglichkeit gibt, die background -Eigenschaft in CSS zu verwenden, um ein Bild auf beiden Seiten der Verknüpfung zu platzieren, wenn der Benutzer darüber schwebt. Hier ist, was ich derzeit haben:Ist es möglich, dasselbe Bild zweimal in der Hintergrundeigenschaft zu verwenden?

nav.vertical li a:hover { 
    background: #D4CD00 url(wnaderknight.png) right/25px 25px no-repeat; 
    color: black; 
} 
+0

Siehe Hintergrund-Position und background-repeat. Aber wenn ich das tun müsste, würde ich normal statt –

+0

verwenden, werde ich das jetzt überprüfen gehen. Wie würde und machen es nur zeigen, wenn der Benutzer über den Link schwebte? Ich sollte erwähnen, dass ich [nav.vertical li] Display gemacht habe: Block –

+0

Ja kannst du! Beispiel: 'background: url (wnadernknight.png) 25px 25px keine Wiederholung, url (wnaderknight.png) rechts/100px 100px keine Wiederholung # D4CD00;' Farbe Hintergrund ist mit dem letzten Bild zu setzen :) –

Antwort

0

Sie mehrere Hintergründe oder pseudos verwenden

.bg { 
 
    display:inline-block; 
 
    padding:30px; 
 
    background:url(http://www.icone-gif.com/icone/nature/terre/terre-32.png) right/25px 25px no-repeat,url(http://www.icone-gif.com/icone/nature/terre/terre-32.png) left/25px 25px no-repeat 
 
} 
 
.psdo:before, 
 
.psdo:after { 
 
    vertical-align:middle; 
 
    display:inline-block; 
 
    content:url(http://www.icone-gif.com/icone/nature/terre/terre-32.png) 
 
}
<a href="#" class="bg"> link with bg image on both sides </a> <br/> 
 
<a href="#" class="psdo"> link with bg image on both sides </a>

+0

Vielen Dank! Der erste Teil hat perfekt funktioniert! –

Verwandte Themen