CSS hover-Effekt ändern der icon-font in einen link
Habe ich ein nav-element, wie so...
<ul class="options-list">
<li><a href="#"><i class="icon icon-print"></i> Print This</a></li>
<li><a href="#"><i class="icon icon-envelope-alt"></i> Send This</a></li>
<li><a href="#"><i class="icon icon-bookmark"></i> Bookmark This</a></li>
<li><a href="#"><i class="icon icon-star"></i> Favourite This</a></li>
<li><a href="#"><i class="icon icon-heart"></i> Like This</a></li>
</ul>
Ich bin mit Font Awesome, die zum generieren der icons. Die CSS ist wie folgt:
.options-list li a {
color: #888;
display: block;
border-bottom: 1px solid #e7e7e7;
padding-top: 7px;
padding-right: 0;
padding-bottom: 7px;}
.options-list li:first-child a {margin: -15px 0 0 0;}
.options-list li:last-child a {border: none;}
.options-list li a:hover {color: #444;}
Offensichtlich das gibt mir ein ändern von text (und das Symbol) Farbe auf hover #444. Nun, was ich tun möchte, ist zu halten, aber das Symbol ändern, um eine andere Farbe auf hover. (ich.e ändert sich der text zu #444, icons änderungen #AE0000 auf hover)
Ich bin nicht sicher, der beste Weg zur Lösung. (Noch Recht neu CCS/HTML, so dass jede Hilfe dankbar mucho!)
Dank!
InformationsquelleAutor shorn | 2012-11-13
Schreibe einen Kommentar Antworten abbrechen
Du musst angemeldet sein, um einen Kommentar abzugeben.
Sie wollen, um die Farbe der
icon
Klasse in einem schwebtea
element.