Sziasztok! :) A mai alkalommal egy design bejegyzéssel érkezem, ahogyan azt ígértem. Megmutatom benne a szerkesztett és gyűjtött textúráimat, az elkészült rendeléseimet, valamint a chatben kért gifeket és különböző segítségeket. Pár karakterrel is szolgálhatok és még jó pár hasznos dologgal ha végiggörgettek. :) UPDATE: A menüpontokba kikerültek az egyes elemek!
Rendezett képek:
Ismét szerepel mindegyiken a "MINTA" szócska. :) Az utolsó adag saját blogra készült.
Gifek:
Remélem jók lesznek:)
Remélem jók lesznek:)
Segítségek:
Valaki kért chatben menükódokat, így most hoztam párat :)
Legördülő menü. Először a kék rész jelenik meg, ha arra rákattintasz, akkor legördül.
HTML modulba illeszd be. A link színe olyan lesz, mint amelyen a blogodon beállított. Annyiszor másolod be a " <li><a href="link helye">Főoldal</a></li>"részt, ahány oldalt szeretnél. A bizonyos részeket egyértelműen átírod.
Kód:
<a href="#" class="button" onclick="javascript:showElement('v-menu')"> <span>Kattints a menühöz!</span> </a></p>
<ul id="v-menu" class="v-menu" style="display: none;">
<li><a href="link helye">Főoldal</a></li>
<li><a href="link helye">Szereplők</a></li>
<li><a href="link helye">Jelentkeztem</a></li>
<li><a href="link helye">Dare to dream</a></li>
<li><a href="link helye">Fejezetek</a></li>
<a href="#" class="button" onclick="javascript:showElement('v-menu')"> <span>Kattints a menühöz!</span> </a></p>
<ul id="v-menu" class="v-menu" style="display: none;">
<li><a href="link helye">Főoldal</a></li>
<li><a href="link helye">Szereplők</a></li>
<li><a href="link helye">Jelentkeztem</a></li>
<li><a href="link helye">Dare to dream</a></li>
<li><a href="link helye">Fejezetek</a></li>
Függőleges menü
Modulba illeszd be.
Kód:
<div align="center">
<table width="100%">
<tbody>
<tr>
<td align="center" class="tartalom">
<a href="link helye" target="_top" class="link2">FŐOLDAL</a>
<a href="link helye" target="_top" class="link2">Fejezetek</a>
<a href="link helye" target="_blank" class="link2">Idézetek</a>
<a href="link helye" target="_blank" class="link2">Dare to dream</a>
<a href="link helye" target="_blank" class="link2">Más blogok</a>
<a href="link helye" target="_top" class="link2">Versenyek<br />
</a></td>
</tr>
</tbody>
</table>
<p><style type="text/css">
a.link2 {
background-color:#f9efe5;
border-bottom: 0px dotted #7E7E7E;
letter-spacing: 1px;
color: #79807F;
width:190px;
height:12px;
text-decoration: none;
cursor:crosshair;
font-weight:normal;
font-size: 9px;
<table width="100%">
<tbody>
<tr>
<td align="center" class="tartalom">
<a href="link helye" target="_top" class="link2">FŐOLDAL</a>
<a href="link helye" target="_top" class="link2">Fejezetek</a>
<a href="link helye" target="_blank" class="link2">Idézetek</a>
<a href="link helye" target="_blank" class="link2">Dare to dream</a>
<a href="link helye" target="_blank" class="link2">Más blogok</a>
<a href="link helye" target="_top" class="link2">Versenyek<br />
</a></td>
</tr>
</tbody>
</table>
<p><style type="text/css">
a.link2 {
background-color:#f9efe5;
border-bottom: 0px dotted #7E7E7E;
letter-spacing: 1px;
color: #79807F;
width:190px;
height:12px;
text-decoration: none;
cursor:crosshair;
font-weight:normal;
font-size: 9px;
text: Gill Sans MT
text-align:left;
padding: 3px;
margin:2px;
display:block;}
a.link2:hover {
background-color:#f9efe5;
letter-spacing: 3px;
color:#A24670;
width:190px;
height:12px;
font-size: 9px;
text-align:left;
padding: 3px;
margin:2px;
display:block;}
a.link2:hover {
background-color:#f9efe5;
letter-spacing: 3px;
color:#A24670;
width:190px;
height:12px;
font-size: 9px;
text: Gill Sans MT
font-weight:normal;
text-decoration: none;
cursor:crosshair;
text-align:right;
margin:2px;
padding: 3px;
display:block;}
-->
</style>
</div>
font-weight:normal;
text-decoration: none;
cursor:crosshair;
text-align:right;
margin:2px;
padding: 3px;
display:block;}
-->
</style>
</div>
Link vastagabb lesz, ha ráviszed a kurzort:
Modulba illeszd be.
Kód:
<STYLE type=text/css>
<!-- a:hover
{font-weight: bolder; } -->
</STYLE>
<!-- a:hover
{font-weight: bolder; } -->
</STYLE>
Betűk közti távolság megnő:
Modulba illeszd be.
Kód:
<STYLE type=text/css>
A:hover {
letter-spacing:2pt; CURSOR: hand; COLOR: black; TEXT-DECORATION: none }
--> </STYLE>
A:hover {
letter-spacing:2pt; CURSOR: hand; COLOR: black; TEXT-DECORATION: none }
--> </STYLE>
Nyomtatott betűk:
Ha ráviszed a kurzort, akkor a betűk nyomtatottá változnak.
Kód:
<style type="text/css">
a:link, a:active, a:visited {color: #000000; font-size: 8pt; text-decoration: none;}
a:hover {color: #000000; font-size: 8pt; text-decoration: none; text-transform: uppercase;}
</style>
a:link, a:active, a:visited {color: #000000; font-size: 8pt; text-decoration: none;}
a:hover {color: #000000; font-size: 8pt; text-decoration: none; text-transform: uppercase;}
</style>
Karakterek:
LB-ról hoztam őket, tehát a nevükre van linkelve az oldaluk, ahol a további képeiket is megtekinthetitek! :)
Masha Sedgwick |
Anila |
Cosette Munch |
Remélem hasznos volt ez a bejegyzés, ha valamit visztek, azt jelezzétek chatben, vagy kommentben! :) Délután még jelentkezem! :)
xx
Cher Brooks
Ez egy irtó hasznos bejegyzés volt, Cher! :)
VálaszTörlésCsak így tovább!
xx, Vacak
Köszönöm szépen, Vacak! :))
TörlésXxx
C. Brooks
Lisa Tellbe második képénél nem ő van rajta hanem Zoella!
VálaszTörlésAmúgy hasznos volt a bejegyzés.:)
Ui: mikor lesz fejléc verseny eredmény hírdetés?
Köszönöm, hogy szóltál, nekem is gyanús volt, hogy nem hasonlít a két lány, de az ő neve alatt találtam :) Köszönöm, igyekszem. :))
TörlésNos, volt már bejegyzésben szó erről, úgy tudom hétvégén lesz.
xx
Cher Brooks
szia, vittem az elején egy kéket ^^
VálaszTörlésVittem párat :)
VálaszTörlésVITTEM A RÓZSASZÍN MENÜKÓDOT! :)
VálaszTörlés