2014. november 30., vasárnap

Menü kódok

Ez most egy ilyen kódos bejegyzés lesz(mint ahogy észrevettétek az utóbbi pár az),ahol  függőleges  menüket találhattok!Egyik sem saját,tehát illene forrást írni!
A menükódok forrása: XX
Remélem mindenkinek tetszik! c:

Menücímek Menü 1 Menü 2 Menü 3 Menü 4 Menü 5



A KÓD:

Menü kódja:
<div align="center">
    <div id="fixmenu">
        Menücímek <a href="#">Menü 1</a> <a href="#">Menü 2</a> <a href="#">Menü 3</a> <a href="#">Menü 4</a> <a href="#">Menü 5</a></div>
</div>

CSS kód:
<style type="text/css">
#fixmenu {
width:180px;
padding:10px;
border: 0px;
text-align:center;
font-weight:bold;
color:#000000;
background-color:#F6F4F4;
}
* html #fixmenu {
position:absolute;
}
#fixmenu a:visited, #fixmenu a {
display:block;
width:170px;
height:20px;
margin:0 auto;
border-top:1px solid #BE9492;
text-align:center;
text-decoration:none;
line-height:20px;
color:#925956;
padding-bottom: 5px;
padding-top: 5px;
}
#fixmenu a:hover {
background-color:#BE9492;
color:#E1CFCE;
}</style>








                                                                          A KÓD:

Menü kódja:
<div align="center">
    <a class="vertical-menu" href="link helye">Menü 1.</a><br />
    <a class="vertical-menu" href="link helye">Menü 2.</a><br />
    <a class="vertical-menu" href="link helye">Menü 3.</a><br />
    <a class="vertical-menu" href="link helye">Menü 4.</a><br />
    <a class="vertical-menu" href="link helye">Menü 5.</a></div>

CSS kód:
                                                               <style type="text/css">
                                                                  a.vertical-menu{
                                                    font-family: Trebuchet MS !important;
                                                            background-color: #F5F5F5;
                                                              color: #000000 !important;
                                                             font-size: 12px !important;
                                                    text-transform: uppercase !important;
                                                                  letter-spacing: 1px;
                                                               padding: 5px 0 3px 0;
                                                                       margin: 2px;
                                                                  text-align: center;
                                                                    width: 250px;
                                                                     height: 20px;
                                                        border-left: 7px solid #000000;
                                                       border-right: 7px solid #000000;
                                                                 text-decoration: none;
                                                                 margin-bottom: 1px;
                                                                  border-radius: 20px;
                                                                 display: inline-block;
                                                                                  }

                                                               a.vertical-menu:hover{
                                                     font-family: Trebuchet MS !important;
                                                            background-color: #000000;
                                                             color: #f5f5f5 !important;
                                                            font-size: 12px !important;
                                                  text-transform: uppercase !important;
                                                      border-left: 7px solid #00A090;
                                                      border-right: 7px solid #00A090;
                                                                                }
                                                                           </style>






FőoldalKódok Segítség Grafika
 
 A KÓD:
     <style type="text/css">
a.sung { /* 1. és 3. menüpont */
    display:block;
    width:100px;
    padding:3px;
    padding-bottom: 8px;
    margin:25px;
    background:#eeeeee;
    font-size:11px;
    Font-Family: tahoma;
    text-align:center;
    Text-decoration:none;
    color:#888888;
    border: 1px solid #1bc3d7;
    text-transform:uppercase;
    letter-spacing:2px;
    height:10px;
    -webkit-transform: rotate(13deg);
    -moz-transform: rotate(13deg);
    -o-transform: rotate(13deg);
    -ms-transform: rotate(13deg);
    transform: rotate(13deg);
    -webkit-transition:All 0.2s ease;
    -moz-transition:All 0.2s ease;
    -o-transition:All 0.2s ease;
}
a.sung:hover{
    color:#000000;
}
   
a.gyuu { /* 2. és 4. menüpont */
    display:block;
    border: 1px solid #d72e2e;
    width:100px;
    padding:3px;
    padding-bottom: 8px;
    margin:30px;
    background:#fff;
    font-size:11px;
    Font-Family: tahoma;
    text-align:center;
    Text-decoration:none;
    color:#888;
    text-transform:uppercase;letter-spacing:1px;
    height:10px;
    -webkit-transform: rotate(-13deg);
    -moz-transform: rotate(-13deg);
    -o-transform: rotate(-13deg);
    -ms-transform: rotate(-13deg);
    transform: rotate(-13deg);
    -webkit-transition:All 0.5s ease ;
    -moz-transition:All 0.54s ease ;
    -o-transition:All 0.5s ease ;
}
a.gyuu:hover{
     color:#000000;
}    </style>
<center>
    <a class="sung" href="http://aranymeli.gportal.hu/">Főoldal</a><a class="gyuu" href="http://aranymeli.gportal.hu/gindex.php?pg=18012139">Kódok</a> <a class="sung" href="http://aranymeli.gportal.hu/gindex.php?pg=20199690">Segítség</a> <a class="gyuu" href="http://aranymeli.gportal.hu/gindex.php?pg=19322271">Grafika</a></center>
 
 
 

1 megjegyzés: