VISSZA
MENÜ
TOVÁBBAz a:link és a:visited álelem kijelölőhöz egy közös, plusz az a:hover és az a:active álelem kijelölőkhöz egy-egy külön háttérképet rendelve egyszerűen készíthetünk linkből nyomógombot.
A háttérkép készítésére bármely képszerkesztő program alkalmas. Mindenki kipróbálhatja kreativitását.
A példában használt stílusdeklarációk a tananyag korábbi fejezeteiben megtalálhatók.
1. Példa:
Forráskód
<style>
a {background: url (zold_btn_1.png);
height:33px; width:159px;
text-align:center; padding-top: 10px;
font: 18px 'Kaushan Script', cursive;
text-decoration:none; letter-spacing:2px;
text-shadow: -1px -1px 2px #00ff00;
display: block; color: #ffffff;}
a:link, a:visited
{ background: url("zold_btn_1.png"); }
a:hover { background: url(zold_btn_1a.png);}
a:active { background: url(zold_btn_2a.png);}
</style>
...
<body>
<a href="#">Tovább</a>
</body>
Eredmény*
* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_link_gomb_hatterkeppel_01.html