|
Saját menü készítése
2013.01.12. 17:29
Saját, egyedi css menüt te is tudsz készíteni és íme erre egy egyszerű példa.
Elsőnek kell egy HTML kód, amiben megadod a menü nevét és az erre hivatkozó URL címet.
HTML kód:
<html>
<a class="navi" href="url">link neve</a>
<a class="navi" href="url">link neve</a>
<a class="navi" href="url">link neve</a>
</html>
Fontos, hogy a class neve majd mindig ugyan az legyen, mint a css kódban a szelektori résznél, de egyszerűbb ha azt át se írjátok, maradjon így. És akkor itt a css kód és a magyarázat hozzá.
CSS kód:
<style>
a.navi:link, a.navi:active, a.navi:visited { /*menü állapota amikor nem viszed rá az egeret*/
IDE JÖN A TE BEÁLLÍTÁSOD!
}
a.navi:hover{ /*amikor ráviszed az egered a menüre*/
IDE JÖN A TE BEÁLLÍTÁSOD
}
</style>
Én ezt alkottam:
Próba link 1 Próba link 2 Próba link 3
Ennek a kódja:
<html>
<a class="navi" href="www.fuckinway.gportal.hu">Próba link 1</a>
<a class="navi" href="www.fuckinway.gportal.hu">Próba link 2</a>
<a class="navi" href="www.fuckinway.gportal.hu">Próba link 3</a>
</html>
<style>
a.navi:link, a.navi:active, a.navi:visited {
background-color:#9ACD32;
width: 50px;
font-family:georgia;
font-style: italic;
font-weight: normal;
color: #ffffff;
cursor:crosshair;
}
a.navi:hover{
background-color:#FF6347;
width: 50px;
font-family:georgia;
font-style: italic;
font-weight: bold;
color: #ffffff;
cursor:crosshair;
}
</style>
| 
AJÁNLOM AZ OLDALT
Friss bejegyzések
Friss hozzászólások
Archívum
