|
Napisał Ludwik (2673 odsłon)
|
|
18.11.2005 16:41 |
W tym tutorialu przedstawię Wam jak można zrobić ikonkę przy linku spotykaną często na niektórych serwisach.
Najważnijeszy jest odpowiedni kod CSS:
.ext
{
background: url("images/2.jpg");
background-position: center right;
background-repeat: no-repeat;
padding-right: 14px;
}
Teraz wyjaśnienie powyższego kodu:
- Linijka #1 - zdefiniowanie nazwy; koniecznie musi nazywać się ext!!
- Linijka #2 - no comment ;).
- Linijka #3 - ścieżka do naszego pliku graficznego. Wpisujemy ją w miejsce: images/2.jpg.
- Linijka #4 - pozycja naszego obrazka względem linku; center to pozycja w pionie, right to pozycja w poziomie.
- Linijka #5 - ponieważ nasz obrazek jest tłem, trzeba zdefiniować czy ma się powtarzać.. Oczywiście nie ma :), dlatego wartość tej linijki jest no-repeat (nie powatarzać).
- Linijka #6 - można to rozumieć w ten sposób:
odległość prawej krawędzi obrazka od ostatniej litery linku.
- Linijka #7 - no comment ;).
Teraz każdy link jaki tworzymy musi mieć następującą formę:
<a href="adres"
class="ext">Link</a>
|
CSS 
