Cikkajánló
Elég régen nem hoztam már menüstílusokat és project dobozokat, így ma mivel volt némi időm hoztam két-két darabot. Nekem nagyon tetszik mindegyik :) A két project doboz majdhogynem megegyezik
Most, hogy már nem szerkesztek napi szinten a G-Portálon kevesebbszer nézem meg például a Portállistát is. De a napokban ránéztem és kíváncsi voltam a portálépítés kategóriára. Örültem is, hogy
Biztos gondoltatok már rá, milyen jó lenne, ha nem csak úgy lehetne kiemelt képet beállítani az oldalra, ha azt előtte feltöltjük, hanem simán mondjuk URL cím megadásával is lehessen,
Emma Roberts G-Portálos téma Instagram doboz weboldalra Project dobozok és egy Elit csere effekt Elit csere effekt szöveggel és képekkel Lana Del Rey és Kylie Jenner G-Portálos témák
Legördülő menü 06.

 
 
 
 

Menü kódja
A perjel helyére kell a link címet másolni!

 

<ul id="menu">
<li>
<a href="/">Főoldal</a></li>
<li>
<a href="/">Hírek</a>
<ul id="submenu">
<li>
<a href="/">Almenü 1.</a></li>
<li>
<a href="/">Almenü 2.</a></li>
<li>
<a href="/">Almenü 3.</a></li>
<li>
<a href="/">Almenü 4.</a></li>
</ul></li>
<li>
<a href="/">Információ</a>
<ul id="submenu">
<li>
<a href="/">Almenü 1.</a></li>
<li>
<a href="/">Almenü 2.</a></li>
<li>
<a href="/">Almenü 3.</a></li>
<li>
<a href="/">Almenü 4.</a></li>
</ul>
</li>
<li>
<a href="/belepes">Galéria</a></li>
</ul>

 

CSS kód

 

<style type="text/css">
#menu{
list-style: none;
}
#menu li{
float: left;
padding: 2px;
position: relative;
}
#menu a{
float: left;
padding: 10px 0;
width: 130px;
}
#menu li a{
font-family: Century Gothic !important;
font-size: 11px !important;
font-weight: normal !important;
color: #B5B5B5;
text-align: center;
background: #393939;
letter-spacing: 1px !important;
text-transform: uppercase;
text-decoration: none;
}
#menu li:hover > a{color: #BFD68B;}
*html #menu li a:hover{ /* IE6 */
color: #BFD68B;
}
#menu li:hover > ul{
display: block;
}
#submenu{
list-style: none;
padding: 0;
display: none;
position: absolute;
top: 41px;
left: 2px;
z-index: 99999;
background: #BFD68B;
width: 130px;
}
#submenu li{
float: none;
margin: 0;
padding: 0;
display: block;
}
#submenu li a{
font-family: Century Gothic !important;
font-size: 13px !important;
font-weight: normal !important;
color: #079032 !important;
background: #BFD68B;
padding: 10px 0;
line-height: 1;
display: block;
white-space: nowrap;
float: none;
text-transform: none;
}
#submenu li a:hover{ /* lenyíló menü színe, ha ráviszed az egeret */
color: #ffffff !important;
background: #b1c778;
}
</style>

lindadesign Hozzászólások
2 002 megtekintés

Hozzászólások