OyunlarBilecik

Yeşil Oyun Sitesi Tasarımı V1

Yeşil Oyun Sitesi Tasarımı
Öncelikle hemen şunu acıklayayım bu tasarım cenkoyun0.tr.gg sitesi için tasarlamıştım. Fakat başkalarınada yararlı olabileceğini düşünerek size değerli ziyaretçilerimize sunuyorum. Tasarım özellikleri genel olarak şunlar;

- Yeşil ve yeşilin tonları kullanılarak oyun sitesine uygun renklendirildi.
- Arkaplana çizgili açık renklerde turuncu bir arkaplan eklenerek tasarım aydınlatıldı.
- Hoversiz fakat her biri fotoshopda hazırlanmış özel bir oyun üst menüsü eklendi.
- Tasarım üstüne yeşilin 2 tonu kullanılanara ve bir maskot eklenerek çeşitlendirildi.
- Alt kısmına 468x60 reklam alanı eklenerek reklam olanağı sağladı.
- Güzel hoverli ve resimli yan menülerle son nokta koyuldu

Not: Önizleme için resmin üstüne yada kodların altındaki yazıya tıklayanız.

---------------------------------------------------------------------

CSS Bölümüne:
<style type="text/css"> h1#title{display: none;} h2#title span {display: none;} div.header{display: none;} li.nav_element{list-style-type: none;} li.nav_element{display: none;} table{margin-right:auto;margin-left:auto;} #anasf { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik/oynustmnana.png); height: 42px; width: 149px; } #anasf:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik/ustmenua1.png); height: 65px; width: 149px; } #iletsm { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik/oynustmnile.png); height: 42px; width: 149px; } #iletsm:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik/ustmenua2.png); height: 65px; width: 149px; } #tplist { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik/oynustmntop.png); height: 42px; width: 149px; } #tplist:hover { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik/ustmenua3.png); height: 65px; width: 149px; } .üstmen { border-right-width: thin; border-right-style: inset; border-right-color: #A95510; } body { background-image: url(https://img.webme.com/pic/o/oyunlarbilecik/turuncs.png); } #menüssss ul li a { color: #D7D9AE; text-decoration: none; font-family: "Comic Sans MS", cursive; font-size: 14px; display: block; margin-bottom: 4px; font-weight: bolder; height: 30px; border-bottom-width: thin; border-bottom-style: dotted; border-bottom-color: #D5D8AC; padding-left: 8px; } #menüssss ul li a:hover { background-color: #486E13; text-align: left; } #menüssss ul { padding-top: 10px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; text-align: left; margin: 0px; } #menüssss ul li { list-style-type: none; } .baslıks { color: #D5D8AC; font-family: "Comic Sans MS", cursive; font-size: 16px; font-weight: bolder; text-align: center; padding-top: 5px; } .baslıks:hover { color: #979A68; } .tavsiye { background-color: #486E13; height: 55px; width: 185px; padding-top: 5px; padding-left: 5px; margin-top: 5px; margin-bottom: 5px; } .tavsiyess { color: #D5D8AC; font-family: "Comic Sans MS", cursive; font-weight: bolder; font-size: 13px; text-decoration: none; } .tavsiyess a { text-decoration: none; color: #D5D8AC; } .tavsiyess a:hover { color: #989B69; } .tavsiyess:hover { color: #979A68; } .tavsiyeimg { border: thin dotted #D5D8AC; } .tavsiyeimg:hover { border: thin dotted #979A68; } .tavsiyektg { color: #D1D4A8; font-family: "Comic Sans MS", cursive; font-size: 10px; } #reklam { height: 60px; width: 468px; margin-top: 9px; } .etikets { background-color: #486E13; height: 175px; width: 175px; margin-top: 7px; border: thin dotted #D5D8AC; margin-left: 7px; text-align: center; margin-bottom: 5px; } .etikets a { color: #979A68; text-decoration: none; font-family: "Comic Sans MS", cursive; font-size: 12px; text-align: center; } #dstsite { } #dstsite ul li a { color: #D5D8AC; text-decoration: none; font-size: 14px; font-weight: bolder; font-family: "Comic Sans MS", cursive; } #dstsite ul li a:hover { color: #979A68; } #dstsite ul { padding-left: 10px; } #dstsite ul li { list-style-type: none; }</style>

Tasarım Üstüne:
<table border="0" cellspacing="0" cellpadding="0" width="958"> <tbody> <tr> <td height="91" valign="bottom" background="https://img.webme.com/pic/o/oyunlarbilecik/oynstsicenk_02.png" width="958"> <table border="0" cellspacing="0" cellpadding="0" width="958"> <tbody> <tr> <td width="136"> </td> <td width="121"> </td> <td valign="bottom" width="152"> <div id="anasf"> </div> </td> <td valign="bottom" width="152" align="right"> <div id="iletsm"> </div> </td> <td valign="bottom" width="155" align="right"> <div id="tplist"> </div> </td> <td width="100"> </td> <td width="142"> </td> </tr> </tbody> </table> </td> </tr> <tr> <td height="211" background="https://img.webme.com/pic/o/oyunlarbilecik/blablabla11vv_04.png " width="958"> <table border="0" cellspacing="0" cellpadding="0" width="958"> <tbody> <tr> <td height="149"> </td> </tr> <tr> <td height="42" align="right" valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="945"> <tbody> <tr> <td height="42" valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/becerioynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/becerioynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/cocukoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/cocukoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/cizgiflmoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/cizgiflmoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/mariooynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/mariooynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/dvsoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/dvsoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/giysioynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/giysioynlr.png" /></a></td> <td height="42" valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/maceraoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/maceraoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/kzoynlar.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/kzoynlar.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/byamaoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/byamaoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/nisanoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/nisanoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/odaoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/odaoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/savasoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/savasoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/sporoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/sporoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/yarisoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/yarisoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img class="üstmen" border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/yemekoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/yemekoynlr.png" /></a></td> <td valign="bottom" width="60"><a href="#" _fcksavedurl="#"><img border="0" alt="" src="https://img.webme.com/pic/o/oyunlarbilecik/zekaoynlr.png" _fcksavedurl="https://img.webme.com/pic/o/oyunlarbilecik/zekaoynlr.png" /></a></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </td> </tr> <tr> <td height="20" background="https://img.webme.com/pic/o/oyunlarbilecik/oynstsicenk2_01.png"> </td> </tr> <tr> <td height="500" valign="top" background="https://img.webme.com/pic/o/oyunlarbilecik/oynmsnsnsn_02.png"> <table border="0" cellspacing="0" cellpadding="0" width="958"> <tbody> <tr> <td width="21"> </td> <td valign="top" width="690" align="center"> <div id="icrkks">

Tasarım Altına:

</div> </td> <td width="13"><img src="http://www.bedava-sitem.com/js/editor_1/editor/images/spacer.gif" style="background-image: url(http://www.bedava-sitem.com/js/editor_1/editor/skins/default/fck_strip.gif); background-position: 0px -544px; " class="TB_Button_Image" alt="" />&nbsp;</td> <td width="190" valign="top"> <table border="0" cellspacing="0" cellpadding="0" width="190"> <tbody> <tr> <td height="35" valign="middle" background="https://img.webme.com/pic/o/oyunlarbilecik/bslkssss2.png" width="190" align="center"><span style="color: #d5d8ac"><strong><span style="font-family: Comic Sans MS">Oyun Katogorileri</span></strong></span></td> </tr> <tr> <td valign="top"> <div id="men&uuml;ssss"> <ul> <li><a href="Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/beceri.png" /> Beceri Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/cocuks.png" /> &Ccedil;ocuk Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/cizgis.png" /> &Ccedil;izgi Film Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="20" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/marios.png" /> Mario Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/dovus.png" /> D&ouml;v&uuml;ş Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/giydirme.png" /> Giydirme Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/macera.png" /> Macera Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/kizs.png" /> Kız Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/boyamas.png" /> Boyama Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/nisan.png" /> Nişan Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/odas.png" /> Oda Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="35" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/savas.png" />Savaş Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/spors.png" /> Spor Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="30" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/yarisss.png" /> Yarış Oyunları</a></li> <li><a href="http://Link Buraya"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/yemeks.png" /> Yemek Oyunları</a></li> <li><a href="http://cenkoyun0.tr.gg/Zeka-oyunlari.htm"><img border="0" alt="" width="25" height="25" src="https://img.webme.com/pic/o/oyunlarbilecik/zekas.png" /> Zeka Oyunları</a></li> </ul> </div> <div>&nbsp;</div> </td> </tr> <tr> <td height="35" valign="middle" background="https://img.webme.com/pic/o/oyunlarbilecik/bslkssss2.png" width="190" align="center"><span style="color: #d5d8ac"><strong><span style="font-family: &quot;Comic Sans MS&quot;">Tavsiye Edilenler</span></strong></span></td> </tr> <tr> <td valign="top" align="left"> <div id="tavsiye" class="tavsiye"> <table border="0" cellspacing="0" cellpadding="0" width="190" height="52"> <tbody> <tr> <td width="74"><a href="#"><img class="tavsiyeimg" alt="" width="65" height="45" src="http://www.korsanoyun.com/data/img/okla_karpuz_vur.jpg" /></a></td> <td valign="top" width="111"> <table border="0" cellspacing="0" cellpadding="0" width="111"> <tbody> <tr> <td> <div id="tavsiyess" class="tavsiyess"><a href="#">Karpuz Vur</a></div> </td> </tr> <tr> <td height="30" valign="middle"> <div id="tavsiyektg" class="tavsiyektg">&gt; Nişan Oyunu</div> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </div> <div id="tavsiye2" class="tavsiye"> <table border="0" cellspacing="0" cellpadding="0" width="190" height="52"> <tbody> <tr> <td width="74"><a href="#"><img class="tavsiyeimg" border="0" alt="" width="65" height="45" src="http://www.korsanoyun.com/data/img/kovboy_duello.jpg" /></a></td> <td valign="top" width="111"> <table border="0" cellspacing="0" cellpadding="0" width="111"> <tbody> <tr> <td> <div id="tavsiyess2" class="tavsiyess"><a href="#">Kowboy D&uuml;ellosu</a></div> </td> </tr> <tr> <td height="30"> <div id="tavsiyektg2" class="tavsiyektg">&gt; Savaş Oyunu</div> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </div> <div id="tavsiye3" class="tavsiye"> <table border="0" cellspacing="0" cellpadding="0" width="190" height="52"> <tbody> <tr> <td width="74"><a href="#"><img class="tavsiyeimg" border="0" alt="" width="65" height="45" src="https://img.webme.com/pic/c/cenkoyun0/civcivleritopla2.jpg" /></a></td> <td valign="top" width="111"> <table border="0" cellspacing="0" cellpadding="0" width="111"> <tbody> <tr> <td> <div id="tavsiyess3" class="tavsiyess"><a href="#">Civcivleri Topla</a></div> </td> </tr> <tr> <td height="30"> <div id="tavsiyektg3" class="tavsiyektg">&gt; Beceri Oyunu</div> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </div> <div id="tavsiye4" class="tavsiye"> <table border="0" cellspacing="0" cellpadding="0" width="190" height="52"> <tbody> <tr> <td width="74"><a href="#"><img class="tavsiyeimg" alt="" width="65" height="45" src="https://img.webme.com/pic/c/cenkoyun0/inanilmaz.jpg" /></a></td> <td valign="top" width="111"> <table border="0" cellspacing="0" cellpadding="0" width="111"> <tbody> <tr> <td> <div id="tavsiyess4" class="tavsiyess"><a href="#">İnanılmaz Adam</a></div> </td> </tr> <tr> <td height="30"> <div id="tavsiyektg4" class="tavsiyektg">&gt; D&ouml;v&uuml;ş Oyunu</div> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> </div> </td> </tr> <tr> <td height="35" valign="middle" background="https://img.webme.com/pic/o/oyunlarbilecik/bslkssss2.png" width="190" align="center"><span style="color: #d5d8ac"><strong><span style="font-family: Comic Sans MS">Etiketler</span></strong></span></td> </tr> <tr> <td> <div id="etikets" class="etikets"><a href="#">oyunlar1, en s&uuml;per oyunlar, oyun oyna, oyunlar oyna, s&uuml;per oyunlar, macera oyunları, boyama oyunları, harika oyunlar, savaş oyunları, tamir oyunlarıi giysi oyunları, oyun, cenk oyun0, cenkoyun, kraloyun, oyunun kralı, ben10 oyunları, oyunlar burada, oyun oyun</a></div> </td> </tr> <tr> <td height="35" valign="middle" background="https://img.webme.com/pic/o/oyunlarbilecik/bslkssss2.png" width="190" align="center"><span style="color: #d5d8ac"><strong><span style="font-family: Comic Sans MS">Dost Siteler</span></strong></span></td> </tr> <tr> <td> <div id="dstsite"> <ul> <li><a href="oyunlarbilecik.tr.gg">-Oyunlarbilecik.tr.gg</a></li> <li><a href="#">-Dost Site 2</a></li> <li><a href="#">-Dost Site 3</a></li> <li><a href="#">-Dost Site 4</a></li> <li><a href="#">-Dost Site 5</a></li> <li><a href="#">-Dost Site 6</a></li> </ul> </div> </td> </tr> </tbody> </table> </td> <td width="44">&nbsp;</td> </tr> </tbody> </table> </td> </tr> <tr> <td height="15" background="https://img.webme.com/pic/o/oyunlarbilecik/oynstsicenk2_03.png" width="958">&nbsp;</td> </tr> <tr> <td height="156" background="https://img.webme.com/pic/o/oyunlarbilecik/oynstsicenk_06.png" width="958"> <table border="0" cellspacing="0" cellpadding="0" width="958"> <tbody> <tr> <td height="143" width="84">&nbsp;</td> <td width="469"> <div id="reklam">&nbsp;</div> </td> <td width="43">&nbsp;</td> <td width="158"> <p>Buraya Herhangi Bi Yazı Yada Resim Gelebilir OyunlarBilecik.Tr.gG Sunar... Tolgahan &Ccedil;elik</p> </td> <td width="204">&nbsp;</td> </tr> </tbody> </table> </td> </tr> </tbody> </table>

>>> Tasarım Önizlemesi İçin Tıklayın <<<

Yeşil Oyun Sitesi Tasarımı V1