[CSS/JS] Button rollover z tekstem

[CSS/JS] Button rollover z tekstem

swist666 Zobacz profil	30.12.2008, 22:35:04 Post #1
Grupa: Zarejestrowani Postów: 152 Pomógł: 1 Dołączył: 14.05.2004 Skąd: Wrocław Ostrzeżenie: (0%)	Witam chciałbym zrobić button - coś na wzór youtube "Ulubione" ( http://i41.tinypic.com/nwzvis.jpg ), jednak napotkałem parę problemów: 1) Pewnie wyda wam się banalny ale ja nie mogę znaleść rozwiązania jak poprawnie uzyskać podkreślenie kropkowane, metoda którą znałem nie działa: [HTML] pobierz, plaintext A.tralala:link, visited{border-bottom:1px solid #000000; text-decoration:none; color:#000000; font-family:Tahoma, Geneva, sans-serif;} A.tralala:hover{border-bottom:1px solid #000000; text-decoration:none; color:#000000; font-family:Tahoma, Geneva, sans-serif;} [HTML] pobierz, plaintext - w Firefoxie i pod IE działa, jednak opera jakoś dziwnie sama dobiera odsępy między kropkami w różynch linkach: http://i42.tinypic.com/2mzf81h.jpg :/ i nie wiem jak to rozwiązać 2) chciałbym aby ikonki obok były obsługiwane przez rollover jak na youtube a niestety nie wiem jak to zrobić jak stosuje margin-top: 15px; to albo dla samej ikonki (a chcę, żeby działało dla ikonki i dla tekstu), albo jak dam klase do wszystkiego to margin też dotyczy tekstu i się rozjeżdża :/ macie jakieś rady??

ziqzaq Zobacz profil	30.12.2008, 23:06:34 Post #2
Grupa: Zarejestrowani Postów: 428 Pomógł: 128 Dołączył: 17.06.2007 Ostrzeżenie: (0%)	Wystarczy chwilę pokombinować, dostosuj sobie: [PHP] pobierz, plaintext <?php <html> <head> <title>Tit</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> .link-ulubione, .link-ulubione:active, .link-ulubione:visited { padding: 0 0 0 22px; text-decoration: none; background: url('obrazek.png') no-repeat left center; } .link-ulubione span { border-bottom: 1px dotted #00f; } </style> </head> <body> <a href="#" class="link-ulubione"><span>Tutaj tekst</span></a> </body> </html> ?> [PHP] pobierz, plaintext Jak chcesz jakieś rollover to poprostu dodaj :hover i baw się obrazkiem i tekstem. Powodzenia // Edit: Gwoli ścisłości hover ze zmianą obrazka (na wszelki wypadek): [PHP] pobierz, plaintext <?php <style type="text/css"> .link-ulubione:hover { background: url('inny_obrazek.png') no-repeat left center; } </style> ?> [PHP] pobierz, plaintext Możesz oczywiście zmienić trochę położenie obrazka (np. trochę w prawo do góry) zamiast zmieniać go całego - też fajny efekt. Ten post edytował ziqzaq 30.12.2008, 23:17:19

1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)

0 Zarejestrowanych:

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Aktualny czas: 28.06.2025 - 06:06

Hosting zapewnia