kursy
Podświetlane linki
Dawniej linki były strasznie statyczne. Wykorzystując sam HTML nie dało się z resztą z nich zbyt wiele wykrzesać. Później z pojawieniem się DHTMLa, sytuacja lekko uległa zmianie, ale dopiero CSS [i poprawne interpretowanie kodu CSS przez główne przeglądarki] przyniósł przełom.
Na początek może zmiana koloru hiperłącza po najechaniu:
..
<html>
<head>
<title>Strona</title>
<style type="text/css">
a {
color: black;
text-decoration: none;
}
</style>
</head>
<body>
<a href="link.htm">To jest czarne hiperłącze bez podreślenia</a>
...
W powyższym przykładzie widać, że całą deklarację [bardziej fachowo - "regułę CSS"] wrzuciłem w sekcję head. Dzięki temu można bardzo łatwo zmieniać wygląd wszystkich linków na stronie. Zmień więc dopisując w regule a [między a { tu wpisz }] "color: red;". Zapisz i odśwież. jak widzisz odnośnik zmienił swój kolor. Dodaj obok niego nieskończoną liczbę odnośników, a zobaczysz, że wszytkie dzięki tej jednej regule zmienia swój wygląd!
Skoro już stworzyłeś link o innych właściwościach niż te przypisane mu domyślnie, czas na zmianę wyglądu odnośnika po najechaniu:
..
<html>
<head>
<title>Strona
<style type="text/css">
a {
color: black;
text-decoration: none;
}
a:hover {
color: silver;
text-decoration: underline;
}
</style>
</head>
<body>
<a href="link.htm">To jest czarne hiperłącze bez podreślenia, ale najedź na nie!</a>
...
W tym przykładzie dodałem kolejną regułę. a:hover służy do opisania właściwości odnośnika w sytuacji, w której kursor myszy znajduję się bezpośrednio nad nim. Jdyne co zmieniłem to kolor i przywróciłem podkreślenie.
Zmiana tła linku po najechaniu
Poprzednie przykłady zmieniały wygląd samego linku, teraz pokażę, jak zmienić wygląd tła linku w zależności od tego, co się dzieje:
..
<html>
<head>
<title>Strona</title>
<style type="text/css">
a { color: black; text-decoration: none; }
a:hover {
color: silver; text-decoration: underline;
background: blue;
}
</style>
</head>
<body>
<a href="link.htm">To jest czarne hiperłącze bez podreślenia, ale najedź na nie!</a>
...
Jeśli znasz choć podstawy angielskiego to już się domyślasz, ze zmieniłem kolor tła po najechaniu na niebieski. Nie jest to najpięknieszy kolor, ale tu chodzi o przykład.
Więcej znaleźć można na stronach:
Patryk 'yarpo' Jar
