2018. 05. 12.Videó | Kép élénkítése Photoshop-ban
2018. 05. 05.ColorCop színlopó program
2018. 04. 30.Coppermine | Kép és fájlméret megadása az indexképek alatt
2018. 04. 24.Coppermine | Thumbnails képek méretének változtatása egyszerűen
2018. 04. 18.Videó | PNG készítése Photoshop-ban
Coppermine Gallery themes

Coppermine Gallery themes
227 napja
553 néző

WordPress themes

WordPress themes
228 napja
177 néző

G-Portál themes

G-Portál themes
228 napja
103 néző

Tumblr themes

Tumblr themes
228 napja
153 néző

Vízszintes menü 23.

 

Menü kódja
A perjel helyére jönnek a menük linkjei. A menü kódjában ez a rész    az ikon és a menücím közötti szünet.

 

<div id="navi">
<div class="navi-link-left">
<a class="active" href="/"><div class="fa fa-home"></div>&nbsp;&nbsp;Főoldal</a> <a href="/"><div class="fa fa-facebook-official"></div>&nbsp;&nbspFacebook</a> <a href="/"><div class="fa fa-camera"></div>&nbsp;&nbspGaléria</a></div>
<div class="navi-link-right">
<a href="/"><div class="fa fa-folder"></div>&nbsp;&nbspOldal</a> <a href="/"><div class="fa fa-info"></div>&nbsp;&nbspKapcsolat</a></div>
</div>

 

Ikonok megjelenítésének kódja
WordPress-esek plugint is használhatnak ez helyett. Leírása itt található meg.
G-portálosoknak kötelező a lejjebb látható kód, ha ikonokat is szeretnétek megjeleníteni a menüben. Több ikon közül itt tudtok válogatni: Font Awesome Icons

 

Ikon kódja

 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

 

CSS kód

 

<style type="text/css">
#navi {
margin: 0;
padding: 12px 4px;
overflow: hidden;
background: #333333; /* menü háttérszíne */
width: 600px; /* menü szélessége */
}
.navi-link-left {
float: left;
}
.navi-link-left a { /* bal menüpontok */
font-family: Arial;
font-size: 13px;
display: inline;
color: #ffffff; /* menücímek színe */
text-align: center;
padding: 0 16px;
text-decoration: none;
}
.navi-link-left a:hover { /* ha ráviszed az egeret */
color: #ffffff; /* menücímek színe */
background: #707072; /* menücímek háttere */
padding: 10px 16px;
text-decoration: none;
}
.navi-link-left .active {
background: #6075AC;
padding: 10px 16px;
}
.navi-link-right {
display: inline;
float: right;
}
.navi-link-right a { /* jobb menüpontok */
font-family: Arial;
font-size: 13px;
display: inline;
color: white;
text-align: center;
padding: 0 16px;
text-decoration: none;
}
.navi-link-right a:hover { /* ha ráviszed az egeret */
color: #ffffff;
background: #000000;
padding: 10px 16px;
text-decoration: none;
}</style>

 

Forrás nincsen. A menüt én készítettem.


2 030 megtekintés

Hozzászólások