|
Vízszintes menü 13.
Demó látható a fejléc környékén.
Ez a menüstílus egy fejléces menü. Az értékeket a kódban kell beállítani. Minden menüpontnak külön értéket kell állítani elhelyezkedésre is és a CSS kódban is a kinézeteket. Lépcsőzetes formát is beállíthatsz neki 
Csak illeszd be a kódot egyszerű modulod forráskód nézetébe, írd át az értékeket és a színeket, ha ez neked nem felel meg. A menücímeket és a menülinkeket is írd át. Okézd le és kész is 
<DIV style="LEFT: 10px; POSITION: absolute; TOP: 100px;">
<a class="navigation" href="//aranymeli.gportal.hu/" > <navi> Főoldal </navi> <br> <subtitle> Home </subtitle> </a></DIV>
<DIV style="LEFT: 122px; POSITION: absolute; TOP: 100px;">
<a class="navigation1" href="//aranymeli.gportal.hu/gindex.php?pg=24588232"> <navi> Site </navi> <br> <subtitle> Oldal </subtitle> </a></DIV>
<DIV style="LEFT: 234px; POSITION: absolute; TOP: 100px;">
<a class="navigation2" href="//aranymeli.gportal.hu/gindex.php?pg=19322271"> <navi> Graphics </navi> <br> <subtitle> Grafikák </subtitle> </a></DIV>
<DIV style="LEFT: 346px; POSITION: absolute; TOP: 100px;">
<a class="navigation3" href="//aranymeli.gportal.hu/gindex.php?pg=20199690"> <navi> Segítség </navi> <br> <subtitle> Leírások </subtitle> </a> </DIV>
<DIV style="LEFT: 458px; POSITION: absolute; TOP: 100px;">
<a class="navigation4" href="//aranymeli.gportal.hu/gindex.php?pg=18012139"> <navi> Scripts </navi> <br> <subtitle> Kódok </subtitle> </a></DIV>
<DIV style="LEFT: 570px; POSITION: absolute; TOP: 100px;">
<a class="navigation5" href="//aranymeli.gportal.hu/belepes"> <navi> Belépés </navi> <br> <subtitle> Regisztráció </subtitle> </a></DIV>
<DIV style="LEFT: 682px; POSITION: absolute; TOP: 100px;">
<a class="navigation6" href="http://users2.smartgb.com/g/g.php?a=s&i=g24-02933-45"> <navi> Vendégkönyv </navi> <br> <subtitle> Ide írj nekem </subtitle> </a></DIV>
<DIV style="LEFT: 794px; POSITION: absolute; TOP: 100px;">
<a class="navigation7" href="//aranymeli.gportal.hu/gindex.php?pg=12241863"> <navi> Hirdetőkönyv </navi> <br> <subtitle> Itt hirdess </subtitle> </a> </DIV>
<style type="text/css">
navi {
font-weight: normal;
font-family: "Century Gothic";
font-size: 15px;
letter-spacing: 0px;
text-shadow: 1px 1px 1px #9A9A9A;
}
subtitle {
font-weight: normal;
font-family: "Century Gothic";
font-size: 13px;
color: #9a9a9a;
letter-spacing: 0px;
text-shadow: 1px 1px 1px #ffffff;
}
A.navigation:link, A.navigation:visited {
display: block;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #000000;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
color: #000000;
text-decoration: none;
}
A.navigation:hover, A.navigation:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none;
}
/* 2. menüpont */
A.navigation1:link, A.navigation1:visited {
display: block;
color: #A35168;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #A35168;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none;
}
A.navigation1:hover, A.navigation1:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none;
}
/* 3. menüpont */
A.navigation2:link, A.navigation2:visited {
display: block;
color: #078DAF;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #078DAF;
border-bottom: 0px solid #ddb7c3;
border-right: 0px solid #ddb7c3;
border-left: 0px solid #ddb7c3;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
A.navigation2:hover, A.navigation2:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
/* 4. menüpont */
A.navigation3:link, A.navigation3:visited {
display: block;
color: #C5751D;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #C5751D;
border-bottom: 0px solid #ddb7c3;
border-right: 0px solid #ddb7c3;
border-left: 0px solid #ddb7c3;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
A.navigation3:hover, A.navigation3:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
/* 5. menüpont */
A.navigation4:link, A.navigation4:visited {
display: block;
color: #4213CE;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #4213CE;
border-bottom: 0px solid #ddb7c3;
border-right: 0px solid #ddb7c3;
border-left: 0px solid #ddb7c3;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
A.navigation4:hover, A.navigation4:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
/* 6. menüpont */
A.navigation5:link, A.navigation5:visited {
display: block;
color: #CE009A;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #CE009A;
border-bottom: 0px solid #ddb7c3;
border-right: 0px solid #ddb7c3;
border-left: 0px solid #ddb7c3;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
A.navigation5:hover, A.navigation5:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
/* 7. menüpont */
A.navigation6:link, A.navigation6:visited {
display: block;
color: #1CE0E0;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #1CE0E0;
border-bottom: 0px solid #ddb7c3;
border-right: 0px solid #ddb7c3;
border-left: 0px solid #ddb7c3;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
A.navigation6:hover, A.navigation6:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
/* 8. menüpont */
A.navigation7:link, A.navigation7:visited {
display: block;
color: #C93236;
text-align: center;
background-color: #e8e8e8;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #C93236;
border-bottom: 0px solid #ddb7c3;
border-right: 0px solid #ddb7c3;
border-left: 0px solid #ddb7c3;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
A.navigation7:hover, A.navigation7:active {
display: block;
color: #959595;
text-align: center;
background-color: #e0e0e0;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 0px;
border-top: 4px solid #959595;
margin-bottom: 0px;
margin-top: 4px;
line-height: 18px;
width: 110px;
height: 40px;
text-decoration: none; }
< /style >
|
AJÁNLOM AZ OLDALT
