...::Herşey Burada::...

CSS Tasarımlar1

Tasarımın Üzerindeki Yazı

<div id="tasarim">
<div id="ust">

<div class="logo">

<a href="http://www.mrossi.tr.gg/" target="_self"><img height="100" border="0" width="298" src="https://img.webme.com/pic/m/mrossi/lgnew.gif" alt="" /></a>

</div>

<div class="reklamalani">

<a href="http://www.mrossi.tr.gg"><img border="0" title="MrOssi.Tr.Gg" src="https://img.webme.com/pic/m/mrossi/newbnner.gif" style="width: 468px; height: 64px;" alt="" /></a></div>

<div class="ustmenuosman">

<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.indentmenu{
font: bold 13px Arial;
width: 100%; /*leave this value as is in most cases*/
overflow: hidden;
}

.indentmenu ul{
margin: 0;
padding: 0;
float: left;
width: 100%; /*width of menu*/
border: 1px solid #C0C0C0 ; /*dark purple border*/
border-width: 1px 0;
background: gainsboro url(media/indentbg.gif) center center repeat-x;
}

.indentmenu ul li{
display: inline;
}

.indentmenu ul li a{
float: left;
color: gray ; /*text color*/
padding: 5px 11px;
text-decoration: none;
border-right: 1px solid #C0C0C0; /*dark purple divider between menu items*/
}

.indentmenu ul li a:visited{
color: gray;
}

.indentmenu ul li a:hover, .indentmenu ul li .current{
color:gray !important; /*text color of selected and active item*/
padding-top: 6px; /*shift text down 1px for selected and active item*/
padding-bottom: 4px; /*shift text down 1px for selected and active item*/
background: #d3d3d3   url(media/indentbg2.gif) center center repeat-x;
}

</style>
<div class="indentmenu">
<ul>
<li><a href="http://mrossi.tr.gg">Ana Sayfa</a></li>
<li><a href="http://mrossi.tr.gg/defter.htm">Z.Defteri</a></li>
<li><a href="http://mrossi.tr.gg/iletisim.htm">İletişim</a></li>
<li><a href="http://mrossi.tr.gg/Toplist.htm">Toplist</a></li>
<li><a href="http://mrossi.tr.gg/Hakkimda.htm">Hakkımda</a></li>
<li><a href="http://mrossi.tr.gg/Aksaray.htm">Aksaray</a></li>
<li><a href="http://mrossi.tr.gg/Sohbet.htm">Sohbet</a></li>
<li><a href="http://www.mrossi.tr.gg/Search.htm">Arama</a></li>
<li><a href="http://mrossi.tr.gg/Bizim-Oda.htm">Bizim Oda</a></li>
<li><a href="http://mrossi.tr.gg/Siten-%26%23304%3Bcin.htm">Siten İçin</a></li>
</div>

<table height="396" cellspacing="0" cellpadding="0" border="0" width="729" style="width: 0px; height: 6px;">
    <tbody>
        <tr>
            <td valign="top" align="left" width="0">
            <table cellspacing="0" cellpadding="0" border="0" background="https://img.webme.com/pic/m/mrossi/dyrusl68.bmp" style="width: 116px; height: 44px;">
                <tbody>
                    <tr>
                        <td align="center"> </td>
                    </tr>
                </tbody>
            </table>
            </td>
            <td valign="top" align="center">
            <table cellspacing="0" cellpadding="0" border="0" background="https://img.webme.com/pic/m/mrossi/dyrrasa68.bmp" style="width: 700px; height: 44px;">
                <tbody>
                    <tr>
                        <td align="center"><strong>        <marquee>      <span style="font-family: Arial;">

Sitemize Yeni Makaleler Eklendi -
Ana Sayfamızın Görünümü Değişti -

</span></marquee>                                  </strong></td>
                    </tr>
                </tbody>
            </table>
            </td>
        </tr>
    </tbody>
</table>
<div id="sidebar_container"> </div>

</div></div>
<div id="orta">

<div class="menuosman">

<div class="arrowlistmenu">

</div>

</div>
<div class="icerikosman">

Tasarımın Altındaki Yazı

</div>
</div>

<div id="alt">

<div id="footer"><p class="altreklam">

<br><br>
<strong><span style="color: rgb(0, 0, 0);">Bugün: 40 - Tıklanma: 230 - Aktif: <script src="http://fastonlineusers.com/online.php?d=http://www.pckent.tr.gg" type="text/javascript"></script> - IP : 88.238.71.255 - </span></strong><span style="color: rgb(0, 0, 0);"> <script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script><style type="text/css"> html .fb_share_link { padding:5px 0 0 20px; height:20px; background:url(https://img.webme.com/pic/p/pckent/face.png) no-repeat top left; }</style><a title="Facebook'ta Paylaş" onclick="return fbs_click()" class="fb_share_link" target="_blank" href="http://www.facebook.com/share.php?u=<url>"><span style="color: red;"><strong><br />
</strong></span> </a> </span>

</div></div>

</div>

Realist Vs

</div>
</div>

Css Kodu

Tasarımın Üzeri

<div id="hast"> <div id="headerben"> <div class="iconcan"> <a href="http://mrossi.tr.gg" _fcksavedurl="http://mrossi.tr.gg" target="_self"><span style="font-size: medium;"><strong><img height="60" border="0" width="436" src="https://img.webme.com/pic/m/mrossi/newbnner.gif" _fcksavedurl="https://img.webme.com/pic/m/mrossi/newbnner.gif" alt="" /></strong></span></a> </div><div class="menucan"> <style type="text/css"> /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ .indentmenu{ font: bold 13px Arial; width: 100%; /*leave this value as is in most cases*/ overflow: hidden; } .indentmenu ul{ margin: 0; padding: 0; float: left; width: 100%; /*width of menu*/ border: 1px solid #FFFFFF; /*dark purple border*/ border-width: 1px 0; background: lightskyblue url(media/indentbg.gif) center center repeat-x; } .indentmenu ul li{ display: inline; } .indentmenu ul li a{ float: left; color: white; /*text color*/ padding: 5px 11px; text-decoration: none; border-right: 1px solid #FFFFFF; /*dark purple divider between menu items*/ } .indentmenu ul li a:visited{ color: white; } .indentmenu ul li a:hover, .indentmenu ul li .current{ color: white !important; /*text color of selected and active item*/ padding-top: 6px; /*shift text down 1px for selected and active item*/ padding-bottom: 4px; /*shift text down 1px for selected and active item*/ background: black url(media/indentbg2.gif) center center repeat-x; } </style> <div class="indentmenu"> <ul> <li><a href="http://www.osmantalay.tr.gg/" _fcksavedurl="http://www.osmantalay.tr.gg/">Ana Sayfa</a></li> <li><a href="http://osmantalay.tr.gg/Konuk-Defteri.htm" _fcksavedurl="http://osmantalay.tr.gg/Konuk-Defteri.htm">Z.Defteri</a></li> <li><a href="http://osmantalay.tr.gg/iletisim.htm" _fcksavedurl="http://osmantalay.tr.gg/iletisim.htm">İletişim</a></li> <li><a href="http://osmantalay.tr.gg/Hakkimda.htm" _fcksavedurl="http://osmantalay.tr.gg/Hakkimda.htm">Hakkımda</a></li> <li><a href="http://osmantalay.tr.gg/Sohbet.htm" _fcksavedurl="http://osmantalay.tr.gg/Sohbet.htm">Sohbet</a></li> <li><a href="http://osmantalay.tr.gg/Aksaray.htm" _fcksavedurl="http://osmantalay.tr.gg/Aksaray.htm">Aksaray</a></li> <li><a href="http://osmantalay.tr.gg/Destek-Ol.htm" _fcksavedurl="http://osmantalay.tr.gg/Destek-Ol.htm" class="current">Destek Ol</a></li> <li><a href="http://osmantalay.tr.gg/Toplist.htm" _fcksavedurl="http://osmantalay.tr.gg/Toplist.htm">Toplist</a></li> <li><a href="http://osmantalay.tr.gg/Css-Tasarimlar.htm" _fcksavedurl="http://osmantalay.tr.gg/Css-Tasarimlar.htm">Tasarımlar</a></li> <li><a href="http://osmantalay.tr.gg/Htlm-Kodlari.htm" _fcksavedurl="http://osmantalay.tr.gg/Htlm-Kodlari.htm">Html Kodları</a></li> <li><a href="http://bedava-sitem.com" _fcksavedurl="http://bedava-sitem.com">Kaynak</a></li> </div> <table height="396" cellspacing="0" cellpadding="0" border="0" width="855" style="width: 0px; height: 0px;"> <tbody> <tr> <td valign="top" align="left" width="400"> <table cellspacing="0" cellpadding="0" border="0" background="https://img.webme.com/pic/m/mrossi/soldyru68.bmp" style="width: 100px; height: 44px;"> <tbody> <tr> <td align="center"> </td> </tr> </tbody> </table> </td> <td valign="top" align="center"> <table cellspacing="0" cellpadding="0" border="0" background="https://img.webme.com/pic/m/mrossi/sagdyru68.bmp" style="width: 778px; height: 44px;"> <tbody> <tr> <td align="center"><strong> <marquee> <span style="font-family: Tahoma;"> Burası Duyurular- Mrossi.tr.gg </span></marquee> </strong></td> </tr> </tbody> </table> </td> </tr> </tbody> </table> <div id="sidebar_container"> </div> </div></div> <div id="icerik"> <div id="icontent"> <div class="writer">

Tasarımın Altı

</div> </div> </div> <div id="footerbe"><div class="destekcan"> <br><br> <br> <br> <br> <strong></strong>Tasarimlar | Bugün: 67 | Klik: 362 | Aktif: <script src="http://fastonlineusers.com/online.php?d=http://wwwosmantalay.tr.gg" type="text/javascript"></script> | IP: 88.224.126.91 </div> </div></div> </div> Realist Vb Kodlar <br>

Css Kodu

Tasarım Üzerine Kod

Tasarım Altına Kod

Css Style Kodları

table {margin-left: auto;margin-right: auto}
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;}
* {padding: 0; margin:0 }
body {
margin-left: 0 auto;
margin-right:0 auto;
background:  none top center fixed;
}
#tasarim{
width: 1000px;
margin-left: 0 auto;
margin-right:0 auto;
}
#baslik{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/h/hackerfriend4/header.png);
width: 1000px;
height: 0px;
float: left;
text-align: center;
padding: 0px 0 0 0;
font-size: 20px;
color: #ff0000;
font-family: Verdana, arial;
}
#ust{
margin-left: 0 auto;
margin-bottom: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/f/flashmix/h11.png);
width: 1000px;
height: 191px;
float: left;
}
#orta{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/f/flashmix/h22.png);
width: 1000px;
height: 100%;
float: left;
}
.solsutun{
width:155px;
float: left;
padding: 0 0 0 36px;
overflow: hidden;
}
.sagsutun {
width:765px;
float: left;
padding: 0 0 0 35px;
overflow: hidden;
text-align: justify;
}
#alt{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/f/flashmix/h33.png);
width: 1000px;
height: 40px;
float: left;
}
<div id="alt">aaaaa</div>
body {
background: #;
color: #666;
}
h1 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
margin:0;
padding:0;
}
hr {
border:none;
border-top:1px solid #CCCCCC;
height:1px;
margin-bottom:5px;
}
a {
color: #900;
text-decoration: none;
}
/* Root = Vertical, Secondary = Vertical */
ul#navmenu,
ul#navmenu li,
ul#navmenu ul {
margin: 0;
border: 0 none;
padding: 0;
width: 160px; /*For KHTML*/
list-style: none;
}
ul#navmenu:after /*From IE 7 lack of compliance*/{
clear: both;
display: block;
font: 2px/0px serif;
content: ".";
height: 0;
visibility: hidden;
}
ul#navmenu li {
float: left; /*For IE 7 lack of compliance*/
display: block !important; /*For GOOD browsers*/
display: inline; /*For IE*/
position: relative;
}
/* Root Menu */
ul#navmenu a {
border: 1px solid #CCC;
border-right-color: #CCC;
border-bottom-color: #CCC;
padding: 0 6px;
display: block;
background: #EEE;
color: #666;
font: bold 11px/22px Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
height: auto !important;
height: 1%; /*For IE*/
}
/* Root Menu Hover Persistence */
ul#navmenu a:hover,
ul#navmenu li:hover a,
ul#navmenu li.iehover a {
background: #CCC;
color: #;
}
/* 2nd Menu */
ul#navmenu li:hover li a,
ul#navmenu li.iehover li a {
background: #EEE;
color: #666;
}
/* 2nd Menu Hover Persistence */
ul#navmenu li:hover li a:hover,
ul#navmenu li:hover li:hover a,
ul#navmenu li.iehover li a:hover,
ul#navmenu li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 3rd Menu */
ul#navmenu li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 3rd Menu Hover Persistence */
ul#navmenu li:hover li:hover li a:hover,
ul#navmenu li:hover li:hover li:hover a,
ul#navmenu li.iehover li.iehover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 4th Menu */
ul#navmenu li:hover li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 4th Menu Hover */
ul#navmenu li:hover li:hover li:hover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover li a:hover {
background: #CCC;
color: #FFF;
}
ul#navmenu ul,
ul#navmenu ul ul,
ul#navmenu ul ul ul {
display: none;
position: absolute;
top: 0;
left: 150px;
}
/* Do Not Move - Must Come Before display:block for Gecko */
ul#navmenu li:hover ul ul,
ul#navmenu li:hover ul ul ul,
ul#navmenu li.iehover ul ul,
ul#navmenu li.iehover ul ul ul {
display: none;
}
ul#navmenu li:hover ul,
ul#navmenu ul li:hover ul,
ul#navmenu ul ul li:hover ul,
ul#navmenu li.iehover ul,
ul#navmenu ul li.iehover ul,
ul#navmenu ul ul li.iehover ul {
display: block;
}

Tasarım Üstüne Kod

<body>
<div id="container-lvl-1">
<div id="container-lvl-2">
<div id="navigation">
<ul>
<li class="page_item current_page_item"><a href="http://wordpress.blinger.org/" title="Home">Anasayfa</a></li>
<li class="page_item page-item-2"><a href="http://wordpress.blinger.org/index.php/about/" title="About">Sayfa Adı</a></li>
<li class="page_item page-item-3"><a href="http://wordpress.blinger.org/index.php/contact/" title="Contact">Sayfa Adı</a></li>
<li class="page_item page-item-4"><a href="http://wordpress.blinger.org/index.php/link-partners/" title="Link Partners">Sayfa Adı</a></li>
<li class="page_item page-item-8"><a href="http://wordpress.blinger.org/index.php/privacy-policy/" title="Privacy Policy">Sayfa Adı</a></li>
<li class="page_item page-item-8"><a href="http://wordpress.blinger.org/index.php/privacy-policy/" title="Privacy Policy">Sayfa Adı</a></li>
<li class="page_item page-item-8"><a href="http://wordpress.blinger.org/index.php/privacy-policy/" title="Privacy Policy">Sayfa Adııııııı</a></li>
</ul>
</div>
<div id="header">
<h1><a href="http://wordpress.blinger.org/">Limitsiz-Paylasim </a></h1>
<span id="description">Tek Hedefimiz THY <img src="http://theme.webme.com/smiles/smiley.gif" border="0"></span>
</div>
<div id="sub-nav">
<div id="plinks-rss">
<span class="rss-feed"><a href="http://wordpress.blinger.org/index.php/feed/"><span class="inv">RSS</span></a></span>
<span class="prev-entries"></span>
<span class="next-entries"></span>
</div>
<div id="search">
<form method="get" id="searchform" action="http://wordpress.blinger.org">
<div><input type="text" value="Search here..." name="s" id="s" onfocus="if (this.value == 'Search here...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search here...';}" />
<input type="submit" id="searchsubmit" value="" />
</div>
</form>         </div>
</div>      <div id="main-wrapper">
<div id="left">
<h2 id="post-2">Limitsiz-Paylasim Düzenledi</h2>
<div class="entry">

Tasarım Altına Kod

</div>
</div>
<div id="right">
<div id="categories-1" class="sdb-content widget_categories"><h3>Categories</h3>      <ul>
<li class="cat-item cat-item-11"><a href="http://wordpress.blinger.org/index.php/category/sample-category/" title="View all posts filed under Sample Category">Sample Category</a>
</li>
<li class="cat-item cat-item-15"><a href="http://wordpress.blinger.org/index.php/category/sample-category/sample-subcategory/" title="View all posts filed under Sample Subcategory">Sample Subcategory</a>
</li>
<li class="cat-item cat-item-1"><a href="http://wordpress.blinger.org/index.php/category/uncategorized/" title="View all posts filed under Uncategorized">Uncategorized</a>
</li>
</ul>
</div>   <div id="pages" class="sdb-content widget_pages">      <h3>Pages</h3>      <ul>
<li class="page_item page-item-2 current_page_item"><a href="http://wordpress.blinger.org/index.php/about/" title="About">About</a></li>
<li class="page_item page-item-3"><a href="http://wordpress.blinger.org/index.php/contact/" title="Contact">Contact</a></li>
<li class="page_item page-item-4"><a href="http://wordpress.blinger.org/index.php/link-partners/" title="Link Partners">Link Partners</a></li>
<li class="page_item page-item-8"><a href="http://wordpress.blinger.org/index.php/privacy-policy/" title="Privacy Policy">Privacy Policy</a></li>
</ul>
</div>      <div id="recent-posts" class="sdb-content widget_recent_entries">         <h3>Recent Posts</h3>         <ul>
<li><a href="http://wordpress.blinger.org/index.php/sample-category/sample-subcategory/lorem-ipsum-reloaded/">Lorem ipsum reloaded </a></li>
<li><a href="http://wordpress.blinger.org/index.php/sample-category/lorem-ipsum/">Lorem ipsum </a></li>
<li><a href="http://wordpress.blinger.org/index.php/sample-category/sample-post/">Sample Post </a></li>
<li><a href="http://wordpress.blinger.org/index.php/uncategorized/hello-world/">Hello world! </a></li>
</ul>
</div><div id="tag_cloud" class="sdb-content widget_tag_cloud"><h3> Tags</h3><a href='http://wordpress.blinger.org/index.php/tag/delete/' class='tag-link-27' title='1 topic' rel="tag" style='font-size: 8pt;'>Delete</a>
<a href='http://wordpress.blinger.org/index.php/tag/first-post/' class='tag-link-3' title='1 topic' rel="tag" style='font-size: 8pt;'>First&nbsp;Post</a>
<a href='http://wordpress.blinger.org/index.php/tag/interlingua/' class='tag-link-13' title='1 topic' rel="tag" style='font-size: 8pt;'>Interlingua</a>
<a href='http://wordpress.blinger.org/index.php/tag/lectus/' class='tag-link-21' title='1 topic' rel="tag" style='font-size: 8pt;'>Lectus</a>
<a href='http://wordpress.blinger.org/index.php/tag/leo/' class='tag-link-25' title='1 topic' rel="tag" style='font-size: 8pt;'>Leo</a>
<a href='http://wordpress.blinger.org/index.php/tag/libero/' class='tag-link-24' title='1 topic' rel="tag" style='font-size: 8pt;'>Libero</a>
<a href='http://wordpress.blinger.org/index.php/tag/lorem-ipsum/' class='tag-link-14' title='2 topics' rel="tag" style='font-size: 22pt;'>Lorem&nbsp;ipsum</a>
<a href='http://wordpress.blinger.org/index.php/tag/nam/' class='tag-link-26' title='1 topic' rel="tag" style='font-size: 8pt;'>Nam</a>
<a href='http://wordpress.blinger.org/index.php/tag/nunc/' class='tag-link-22' title='1 topic' rel="tag" style='font-size: 8pt;'>Nunc</a>
<a href='http://wordpress.blinger.org/index.php/tag/orci/' class='tag-link-20' title='1 topic' rel="tag" style='font-size: 8pt;'>Orci</a>
<a href='http://wordpress.blinger.org/index.php/tag/pretium/' class='tag-link-18' title='1 topic' rel="tag" style='font-size: 8pt;'>Pretium</a>
<a href='http://wordpress.blinger.org/index.php/tag/reloaded/' class='tag-link-16' title='1 topic' rel="tag" style='font-size: 8pt;'>reloaded</a>
<a href='http://wordpress.blinger.org/index.php/tag/sample-post/' class='tag-link-12' title='2 topics' rel="tag" style='font-size: 22pt;'>Sample&nbsp;Post</a>
<a href='http://wordpress.blinger.org/index.php/tag/sit/' class='tag-link-28' title='1 topic' rel="tag" style='font-size: 8pt;'>Sit</a>
<a href='http://wordpress.blinger.org/index.php/tag/urna/' class='tag-link-23' title='1 topic' rel="tag" style='font-size: 8pt;'>Urna</a>
<a href='http://wordpress.blinger.org/index.php/tag/vivamus/' class='tag-link-19' title='1 topic' rel="tag" style='font-size: 8pt;'>Vivamus</a></div>   <div class="sdb-content">
<h3>Calendar</h3>
<div class="center">
<table id="wp-calendar" summary="Calendar">
<caption>June 2009</caption>
<thead>
<tr>
<th abbr="Monday" scope="col" title="Monday">M</th>
<th abbr="Tuesday" scope="col" title="Tuesday">T</th>
<th abbr="Wednesday" scope="col" title="Wednesday">W</th>
<th abbr="Thursday" scope="col" title="Thursday">T</th>
<th abbr="Friday" scope="col" title="Friday">F</th>
<th abbr="Saturday" scope="col" title="Saturday">S</th>
<th abbr="Sunday" scope="col" title="Sunday">S</th>
</tr>
</thead>
<tfoot>
<tr>
<td abbr="March" colspan="3" id="prev"><a href="http://wordpress.blinger.org/index.php/2008/03/" title="View posts for March 2008">&laquo; Mar</a></td>
<td class="pad">&nbsp;</td>
<td colspan="3" id="next" class="pad">&nbsp;</td>
</tr>
</tfoot>
<tbody>
<tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td>
</tr>
<tr>
<td id="today">8</td><td>9</td><td>10</td><td>11</td><td>12</td><td>13</td><td>14</td>
</tr>
<tr>
<td>15</td><td>16</td><td>17</td><td>18</td><td>19</td><td>20</td><td>21</td>
</tr>
<tr>
<td>22</td><td>23</td><td>24</td><td>25</td><td>26</td><td>27</td><td>28</td>
</tr>
<tr>
<td>29</td><td>30</td>
<td class="pad" colspan="5">&nbsp;</td>
</tr>
</tbody>
</table>      </div>
</div>
<div id="linkcat-2" class="sdb-content widget_links"><h3>Blogroll</h3>
<ul>
<li><a href="http://wordpress.org/development/">Development Blog</a></li>
<li><a href="http://codex.wordpress.org/">Documentation</a></li>
<li><a href="http://wordpress.org/extend/plugins/">Plugins</a></li>
<li><a href="http://wordpress.org/extend/ideas/">Suggest Ideas</a></li>
<li><a href="http://wordpress.org/support/">Support Forum</a></li>
<li><a href="http://wordpress.org/extend/themes/">Themes</a></li>
<li><a href="http://planet.wordpress.org/">WordPress Planet</a></li>
<li><a href="http://wordpresssupplies.com/" title="Download Free Wordpress Themes and Plugins">Wordpress Themes</a></li>
<li><a href="http://greatwordpressthemes.com/">Wordpress Themes</a></li>
</ul>
</div>
<div class="sdb-content">
<h3>Meta</h3>
<ul>
<li><a href="http://wordpress.blinger.org/index.php/feed/" title="Syndicate this site using RSS"><abbr title="Really Simple Syndication">RSS</abbr></a></li>
<li><a href="http://wordpress.blinger.org/index.php/comments/feed/" title="The latest comments to all posts in RSS">Comments <abbr title="Really Simple Syndication">RSS</abbr></a></li>
<li><a href="http://wordpressblogthemes.in/">Create Wordpress Themes</a></li>
</ul>
</div>
</div>      </div>
<div id="footer">
Copyright 2009 - 2010 Web Sitesi  | Powered By  <a href="http://www.wordpress-themes.net-tec.biz">Wordpress Themes</a> | <a href="http://csshost.tr.gg">Css-Host Css Tasarım Merkezi</a>

Css Style Kodları

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;}
/*
Theme Name: Natural
Theme URI: http://www.Graphicadia.com
Description: a clean and simple fixed width, 2-column layout with the sidebar on the right.
Author: HPA
Author URI: http://www.Graphicadia.com
*/
*{margin: 0; padding: 0;}
body{
background: #fff url("http://wordpress.blinger.org/wp-content/themes/natural/images/body-bgr.gif") repeat-x 0 0;
font: 12px Tahoma, Verdana, Arial;
color: #999;
}
.inv{display: block; visibility: hidden;}
p{padding: 5px 0;}
a{text-decoration: none; color: #49c6ea;}
a:hover{color: #999;}
img{
float: left;
margin-right: 10px;
margin-bottom: 2px;
border: 8px solid #999;
}
#container-lvl-1{
width: 100%;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/page-bgr.jpg") no-repeat top center;
text-align: center;
}
#container-lvl-2{
width: 900px;
margin: 0 auto;
padding-bottom: 15px;
text-align: left;
}
#navigation{
width: 900px;
height: 37px;
}
#navigation ul{
width: 899px;
height: 37px;
padding-left: 1px;
overflow: hidden;
}
#navigation ul li{
width: 120px;
height: 37px;
list-style-type: none;
display: inline;
float: left;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/li-wrapper.gif") no-repeat top right;
}
#navigation ul li a{
width: 118px;
height: 26px;
padding-top: 11px;
padding-right: 2px;
display: block;
text-decoration: none;
color: #fff;
text-align: center;
}
#navigation ul li a:hover, #navigation ul .current_page_item a, #navigation ul .current_page_item a:hover{
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/hover.png") no-repeat 0 0;
}
#header{
width: 860px;
height: 149px;
padding-left: 40px;
padding-top: 15px;
position: relative;
}
#header h1{
font: 30px Tahoma;
color: #fff;
line-height: 30px;
padding-top: 5px;
padding-left: 7px;
}
#header h1 a{color: #fff; text-decoration: none;}
#header h1 a:hover{color: #0fb8d6;}
#header #description{
position: absolute;
top: 58px;
left: 47px;
font: 24px Tahoma;
color: #0fb8d6;
}
#sub-nav{
width: 900px;
height: 36px;
position: relative;
}
#plinks-rss{
position: absolute;
top: 7px;
left: 24px;
overflow: hidden;
}
#plinks-rss .rss-feed a, #plinks-rss .rss-feed a:hover{
width: 55px;
height: 23px;
display: block;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/rss.gif") no-repeat 0 0;
float: left;
margin-right: 2px;
}
#plinks-rss .prev-entries a, #plinks-rss .prev-entries a:hover{
width: 28px;
height: 23px;
display: block;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/prev-ent.gif") no-repeat 0 0;
float: left;
margin-right: 2px;
}
#plinks-rss .next-entries a, #plinks-rss .next-entries a:hover{
width: 28px;
height: 23px;
display: block;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/next-ent.gif") no-repeat 0 0;
float: left;
}
#search{
position: absolute;
right: 16px;
}
#searchform{
width: 208px;
padding-top: 7px;
overflow: hidden;
}
#searchform input{float: left;}
#searchform #s{
width: 141px;
height: 18px;
border: 1px solid #969494;
font: 12px Tahoma;
color: #ccc;
padding-left: 5px;
padding-top: 3px;
}
#searchform #searchsubmit{
width: 55px;
height: 23px;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/search-submit.gif") no-repeat 0 0;
border: 0;
cursor: pointer;
margin-left: 5px;
}
#main-wrapper{
width: 860px;
padding: 15px 16px 0 24px;
}
#left{
width: 628px;
margin: 0 auto;
float: left;
}
.title-content{
width: 608px;
height: 73px;
padding: 0 10px;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/title-bgr.gif") no-repeat 0 0;
}
.title-content .meta-data{
width: 608px;
height: 20px;
padding-top: 6px;
position: relative;
color: #c1c1c1;
}
.title-content .meta-data .posted{
position: absolute;
left: 0px;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/date.gif") no-repeat 0 1px;
padding-left: 15px;
}
.title-content .meta-data .comments{
position: absolute;
right: 0px;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/comments-numb.gif") no-repeat 0 1px;
padding-left: 20px;
}
.title-content .meta-data a{text-decoration: none; color: #c1c1c1;}
.title-content .meta-data a:hover{color: #49c6ea;}
#left h2{
font: 24px Tahoma;
font-weight: normal;
color: #49c6ea;
}
#left h2 a{text-decoration: none; color: #49c6ea;}
#left h2 a:hover{color: #999;}
#left h3{
font: 18px Tahoma;
font-weight: normal;
color: #afed1f;
}
.entry{padding-bottom: 25px;}
.commentlist{width: 628px; padding: 10px 0 20px 0;}
.commentlist li{
width: 548px;
list-style-type: none;
padding-left: 80px;
padding-bottom: 15px;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/comment.gif") no-repeat 0 0;
}
#commentform{width: 628px; padding-top: 10px;}
#commentform input{
width: 350px;
background-color: #fff;
border: 1px solid #ccc;
}
#commentform #comment{
width: 500px;
height: 150px;
background-color: #fff;
border: 1px solid #ccc;
font: 12px Tahoma;
}
#commentform #submit{
width: 55px;
height: 23px;
border: 0;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/send.gif") no-repeat 0 0;
cursor: pointer;
}
#right{
width: 208px;
padding-left: 24px;
margin: 0 auto;
float: left;
}
.sdb-content{
width: 208px;
padding-bottom: 20px;
}
.sdb-content h3{
width: 198px;
height: 27px;
font: 14px Tahoma;
font-weight: bold;
text-transform: uppercase;
color: #fff;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/sdb-title.gif") no-repeat 0 0;
padding: 10px 0 0 10px;
}
.sdb-content ul li{
width: 208px;
height: 32px;
list-style-type: none;
border-bottom: 1px dotted #bbb;
}
.sdb-content ul li a{
width: 193px;
height: 23px;
display: block;
text-decoration: none;
color: #777;
padding-top: 9px;
padding-left: 15px;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/sdb-link.gif") no-repeat 0 11px;
}
.sdb-content ul li a:hover{
color: #afed1f;
width: 188px;
padding-left: 20px;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/sdb-link-h.gif") no-repeat 0 11px;
}
.sdb-content ul .recentcomments{
height: 25px;
padding-top: 8px;
}
.sdb-content ul .recentcomments a{text-decoration: none; color: #afed1f;}
.sdb-content ul .recentcomments a:hover{color: #999; background: transparent;}
.center{width: 208px; text-align: center;}
#wp-calendar, #wp-calendar caption{margin: 10px auto 0 auto;}
#wp-calendar td{padding: 0 5px;}
#footer{
width: 900px;
height: 24px;
clear: both;
padding-top: 60px;
color: #ddd;
text-align: center;
background: url("http://wordpress.blinger.org/wp-content/themes/natural/images/footer.gif") no-repeat 0 0;
}
#footer a{text-decoration: none; color: #ddd;}
#footer a:hover{color: #999;}

Tasarım Üstüne Kod

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http:/www.w3.org/1999/xhtml">
<div style="width:900px; position: relative; margin-left: auto; margin-right: auto;">
<div id="todobanners">
<div class="Estilo1" id="cabezal">
<h1 class="Estilo2">Titulo de la web </h1>
</div>
<div id="afiliados">
<div align="center">
<table width="200" border="2" cellspacing="5" bordercolor="#393939" bgcolor="#393939">
<tr>
<td><a href="#"><img src="http://img17.imageshack.us/img17/7584/sinttulo106.gif" width="137" height="137" border="0" /></a></td>
<td><a href="#"><img src="http://img17.imageshack.us/img17/7584/sinttulo106.gif" width="137" height="137" border="0" /></a></td>
<td><a href="#"><img src="http://img17.imageshack.us/img17/7584/sinttulo106.gif" width="137" height="137" border="0" /></a></td>
<td><a href="#"><img src="http://img17.imageshack.us/img17/7584/sinttulo106.gif" width="137" height="137" border="0" /></a></td>
<td><a href="#"><img src="http://img17.imageshack.us/img17/7584/sinttulo106.gif" width="137" height="137" border="0" /></a></td>
</tr>
</table>
</div>
</div>

Tasarım Altına Kod

Css Style Kodları

#cabezal {
background-image: url(http://img23.imageshack.us/img23/8526/sinttulo103.png);
width: 827px;
height: 100px;
background-repeat: no-repeat;
padding-left: 50px;
}
#nav_container {
width: 185px;
float: left;
font-family: Arial, Helvetica, sans-serif;
list-style-type: none;
background-color: #585757;
border: 4px solid #000000;
margin-top: 10px;
font-size: 10px;
padding-bottom: 50px;
}
li.nav_element {
background-image: url(http://img16.imageshack.us/img16/9210/botont.png);
background-repeat: no-repeat;
list-style-type: none;
margin-left: -40px;
height: 31px;
margin-top: -2px;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
padding-top: 7px;
}
li.nav_element:hover {
background-image: url(http://img15.imageshack.us/img15/427/botonhover.png);
background-repeat: no-repeat;
list-style-type: none;
margin-left: -40px;
height: 31px;
margin-top: -2px;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
padding-top: 7px;
}
#pre_content {
background-image: url(http://img93.imageshack.us/img93/4826/sinttulo113.gif);
width: 668px;
float: right;
height: 30px;
padding-top: 10px;
padding-left: 10px;
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
color: #000066;
}
#todobanners {
width: 877px;
}
#content_container {
background-image: url(http://img140.imageshack.us/img140/5089/sinttulo119.gif);
width: 667px;
float: right;
padding-left: 10px;
font-family: Arial, Helvetica, sans-serif;
color: #666666;
}
#abajocontenido {
width: 678px;
height: 84px;
background-image: url(http://img17.imageshack.us/img17/1605/sinttulo117.gif);
float: right;
margin-bottom: 50px;
}
.Estilo1 {font-family: Georgia, "Times New Roman", Times, serif}
.Estilo2 {color: #FFFFFF}
.Estilo3 {font-size: 9px}
.Estilo6 {
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
}
.Estilo7 {
color: #666666;
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#post_header {display: none;}
#header_container {display: none;}
#sidebar_container {display: none;}
h1#title{display: none;}
h2#title span {display: none;}
#arribacontenido p {
border-bottom-width: medium;
border-bottom-style: solid;
margin-right: 350px;
}
#nav_container a {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #00CCFF;
list-style-type: none;
margin-left: 8px;
}
a:link {
color: #333333;
}
a:visited {
color: #000000;
}
a:hover {
color: #333333;
}
a:active {
color: #000000;
}

Tasarım Üstüne Kod

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<meta name="description" content="description"/>
<meta name="keywords" content="keywords"/>
<meta name="author" content="author"/>
<link rel="stylesheet" type="text/css" href="default.css"/>
<title>Gemstone</title>
</head>
<body>
<div class="top"><h1>TU PAGINA <span>TU SLOGAN AQUI</span></h1></div>
<div class="header2">
<div class="menu">
<ul>
<li><div><a href="index.html" id="current">News</a></div></li>
<li><div><a href="index.html">News Archive</a></div></li>
<li><div><a href="index.html">Editorials</a></div></li>
<li><div><a href="index.html">Links</a></div></li>
</ul>
<ul>
<li><div><a href="index.html">Profiles</a></div></li>
<li><div><a href="index.html">Columns</a></div></li>
<li><div><a href="index.html">Hosted Sites</a></div></li>
<li><div><a href="index.html">Forum</a></div></li>
</ul>
<ul>
<li><div><a href="index.html">About</a></div></li>
<li><div><a href="index.html">Guidelines</a></div></li>
<li><div><a href="index.html">RSS Feeds</a></div></li>
<li><div><a href="index.html">Buttons</a></div></li>
</ul>
</div>
</div>
<div class="content_left">
<div class="date">AQUI EL DIA O UN TEXTO</div>
<div class="body">

Tasarım Altına Kod

<div class="clearer"> <span></span></div>
</div>
</div>
<div class="content_right">
<div class="links">
<div class="title">Latest League Results</div>
<a href="#">Hungary - N.America 2-3</a>
<div class="line"><span></span></div>
<a href="#">Sweden - Netherlands 3-2</a>
<div class="line"><span></span></div>
<a href="#">UK - Poland 0-5</a>
<div class="line"><span></span></div>
<a href="#">Germany - Belgium 5-0</a>
<div class="line"><span></span></div>
<a href="#">Russia - Portugal 5-0</a>
<div class="line"><span></span></div>
<a href="#"><b>» more</b></a>
<div class="title">Latest 5 QW Demos</div>
<a href="#">Disconnect vs. Badname</a>
<div class="line"><span></span></div>
<a href="#">Bewi vs. goldenboy</a>
<div class="line"><span></span></div>
<a href="#">Xalibur vs. Hawkkii</a>
<div class="line"><span></span></div>
<a href="#">Me vs. you</a>
<div class="line"><span></span></div>
<a href="#">you vs. me</a>
<div class="line"><span></span></div>
<a href="#"><b>» more</b></a>
<div class="title">Statistics</div>
<a href="#">Hits Today: 1632</a>
<div class="line"><span></span></div>
<a href="#">Hits Alltime: 369843</a>
<div class="line"><span></span></div>
<a href="#">Users: 1991</a>
<div class="line"><span></span></div>
<a href="#">Online: 16</a>
<div class="line"><span></span></div>
<a href="#"><b>» more</b></a>
<div class="line"><span></span></div>
</div>
</div>
<div class="footer">
<div class="copyright">&copy; 2009 <a href="index.html">Website</a>. Adaptado por <a href="http://tuweb.es.tl">Dutch</a></div>
</div>
</body>
</html>

Css Style Kodları

lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
#nav_container{display: none;}
#pre_header{display: none;}
#header{display:none;}
/*#############################################################
Name: Gemstone
Date: 2006-05-30
Author: Viktor Persson
URL: http://arcsin.se
Feel free to use and modify but please provide credits.
#############################################################*/
/* Standard element */
* {
margin: 0;
padding: 0;
}
body {
background: #999 url(http://pixelea.com/s/0ed23f63cf.gif) repeat-y;
font-family: Tahoma,sans-serif;
font-size: 0.8em;
padding-left: 25px;
}
p {
margin-bottom: 1.2em;
}
ul {
margin: 0 0 10px 22px;
}
li {
list-style-image: url(http://pixelea.com/s/b307f7ca70.gif);
}
/* Misc */
.clearer {
clear: both;
}
div.quote {
border-left: 4px solid #36C;
clear: both;
color: #555;
display: block;
font: italic 1.1em Verdana,serif;
margin: 12px 0 12px 16px;
padding-left: 12px;
}
/* Top & Header */
.top {
background: url(http://pixelea.com/s/496bdfc120.gif);
color: #FFF;
height: 45px;
width: 939px;
}
.top h1 {
font: bold 2em sans-serif;
padding: 8px 16px 0;
}
.top h1 span {
font: normal 60% Verdana,sans-serif;
}
.header2 {
background: url(http://pixelea.com/s/84ff7ba1cc.gif);
height: 101px;
width: 939px;
}
/* Menu */
div.menu ul {
float: left;
margin: 0 1px 0 0;
}
div.menu li {
list-style-image: none;
}
div.menu a {
background: #4B4B4B;
color: #DDD;
display: block;
font-family: sans-serif;
font-size: 85%;
padding: 5px 0 5px 8px;
text-decoration: none;
width: 180px;
}
div.menu a#current {
background: #666; color: #FFF;
}
div.menu a:hover {
background: #555; color: #FFF;
}
div.menu li {
list-style-type: none;
margin: 0 0 1px 0;
padding: 0;
}
/* Left side */
div.content_left {
margin: 1px;
width: 593px;
}
div.date {
background: #0070CD url(http://pixelea.com/s/342fe7ce92.gif) repeat-x;
color: #FFF;
font-weight: bold;
padding: 10px;
}
div.newsitem {
background: #F0F0F0 url(http://pixelea.com/s/58c7cd681b.png) repeat-x;
border: 1px solid #EEE;
border-color: #EEE #EEE #DDD #EEE;
clear: both;
color: #333;
line-height: 1.5;
margin: 6px;
padding: 10px;
}
div.newsitem img {
border: 3px double #CCC;
height: 120px;
margin: 6px 10px 10px 10px;
width: 120px;
}
div.newsitem img.left {
float: left;
}
div.newsitem img.right {
float: right;
}
div.newsitem .title {
color: #0066CC;
font: bold 1.2em Tahoma,sans-serif;
padding: 3px 4px;
}
div.newsitem .body {
font-family: "Trebuchet MS",Tahoma,sans-serif;
font-size: 0.9em;
text-align: justify;
}
/* Right side */
div.content_right {
width: 331px;
position: absolute;
top: 116px;
left: 620px;
}
div.links a {
background: url(http://pixelea.com/s/49fbdfcbda.gif) repeat-x #FFF;
display: block;
font: bold 0.8em Verdana,Tahoma,sans-serif;
padding: 6px 0 8px 8px;
text-decoration: none; color: #333;
}
div.links a:hover {
color: #0080DD; background-position: left bottom;
}
div.links div.line {
height: 1px; background-color: #EEEEF5;
}
div.links .title {
background: #333 url(http://pixelea.com/s/e0de8b584c.gif) repeat-x;
color: #FFF;
font: normal 85% Tahoma,sans-serif;
padding: 5px 8px;
}
/* Footer */
div.footer {
background: #F0F0F0 url(http://pixelea.com/s/7a3b093fad.gif) repeat-x;
border: 1px solid #EEE;
color: #FFF;
margin-left: 6px;
width: 581px;
}
div.footer .copyright {
padding: 6px 12px;
}
div.footer a {
color: #FFF;
font: bold 1em "Trebuchet MS",sans-serif;
text-decoration: none;
}

Tasarım Üstüne Kod

Tasarım Altına Kod

Css Style Kodları

Tasarım Üstüne Kod

Tasarım Altına Kod

Css Style Kodları

table {margin-left: auto;margin-right: auto}
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;}
* {padding: 0; margin:0 }
body {
margin-left: 0 auto;
margin-right:0 auto;
background: url(http://img440.imageshack.us/img440/6352/sdsearaewy17ty6.jpg) top center fixed;
}
#tasarim{
width: 1000px;
margin-left: 0 auto;
margin-right:0 auto;
}
#baslik{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/h/hackerfriend4/header.png);
width: 1000px;
height: 0px;
float: left;
text-align: center;
padding: 0px 0 0 0;
font-size: 20px;
color: #ff0000;
font-family: Verdana, arial;
}
#ust{
margin-left: 0 auto;
margin-bottom: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/p/pitoyun/kk1.png);
width: 1000px;
height: 191px;
float: left;
}
#orta{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/p/pitoyun/kk2.png);
width: 1000px;
height: 100%;
float: left;
}
.solsutun{
width:175px;
float: left;
padding: 0 0 0 22px;
overflow: hidden;
}
.sagsutun {
width:765px;
float: left;
padding: 0 0 0 30px;
overflow: hidden;
text-align: justify;
}
#alt{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/p/pitoyun/kk3.png);
width: 1000px;
height: 191px;
float: left;
}
<div id="alt">aaaaa</div>
body {
background: #;
color: #666;
}
h1 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
margin:0;
padding:0;
}
hr {
border:none;
border-top:1px solid #CCCCCC;
height:1px;
margin-bottom:5px;
}
a {
color: #900;
text-decoration: none;
}
/* Root = Vertical, Secondary = Vertical */
ul#navmenu,
ul#navmenu li,
ul#navmenu ul {
margin: 0;
border: 0 none;
padding: 0;
width: 170px; /*For KHTML*/
list-style: none;
}
ul#navmenu:after /*From IE 7 lack of compliance*/{
clear: both;
display: block;
font: 2px/0px serif;
content: ".";
height: 0;
visibility: hidden;
}
ul#navmenu li {
float: left; /*For IE 7 lack of compliance*/
display: block !important; /*For GOOD browsers*/
display: inline; /*For IE*/
position: relative;
}
/* Root Menu */
ul#navmenu a {
border: 1px solid #CCC;
border-right-color: #CCC;
border-bottom-color: #CCC;
padding: 0 6px;
display: block;
background: #EEE;
color: #666;
font: bold 11px/22px Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
height: auto !important;
height: 1%; /*For IE*/
}
/* Root Menu Hover Persistence */
ul#navmenu a:hover,
ul#navmenu li:hover a,
ul#navmenu li.iehover a {
background: #CCC;
color: #;
}
/* 2nd Menu */
ul#navmenu li:hover li a,
ul#navmenu li.iehover li a {
background: #EEE;
color: #666;
}
/* 2nd Menu Hover Persistence */
ul#navmenu li:hover li a:hover,
ul#navmenu li:hover li:hover a,
ul#navmenu li.iehover li a:hover,
ul#navmenu li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 3rd Menu */
ul#navmenu li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 3rd Menu Hover Persistence */
ul#navmenu li:hover li:hover li a:hover,
ul#navmenu li:hover li:hover li:hover a,
ul#navmenu li.iehover li.iehover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 4th Menu */
ul#navmenu li:hover li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 4th Menu Hover */
ul#navmenu li:hover li:hover li:hover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover li a:hover {
background: #CCC;
color: #FFF;
}
ul#navmenu ul,
ul#navmenu ul ul,
ul#navmenu ul ul ul {
display: none;
position: absolute;
top: 0;
left: 150px;
}
/* Do Not Move - Must Come Before display:block for Gecko */
ul#navmenu li:hover ul ul,
ul#navmenu li:hover ul ul ul,
ul#navmenu li.iehover ul ul,
ul#navmenu li.iehover ul ul ul {
display: none;
}
ul#navmenu li:hover ul,
ul#navmenu ul li:hover ul,
ul#navmenu ul ul li:hover ul,
ul#navmenu li.iehover ul,
ul#navmenu ul li.iehover ul,
ul#navmenu ul ul li.iehover ul {
display: block;
}

Tasarım Üzerine Ekle

Tasarım Altına Ekle

Css Style Kodalrına Ekle

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;}
* {padding: 0; margin:0 }
body {
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/o/onlinephotoshop/arkaplan.jpg) top center fixed;
}
#tasarim{
width: 1024px;
margin-left: 0 auto;
margin-right:0 auto;
}
#baslik{
margin-left: 0 auto;
margin-right:0 auto;
background:  none;
width: 1000px;
height: 20px;
float: left;
text-align: center;
padding: 180px 0 0 0;
font-size: 20px;
color: #ff0000;
font-family: Verdana, arial;
}
#ust{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/o/onlinephotoshop/red_01.png);
width: 1024px;
height: 208px;
float: left;
}
#orta{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/o/onlinephotoshop/red_02.png);
width: 1024px;
height: 100%;
float: left;
}
.solsutun{
width:193px;
float: left;
padding: 0 0 0 50px;
overflow: hidden;
}
.sagsutun {
width:675px;
float: left;
padding: 0 0 0 50px;
overflow: hidden;
text-align: justify;
}
#alt{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/o/onlinephotoshop/red_03.png);
width: 1024px;
height: 342px;
float: left;
}

Tasarım Üstüne Kod

Tasarım Altına Kod

</div>
<div class="PFtop"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt=" " /></div>
<div class="PFpst">
<span class="spanchunk tagiconbox">
<img class="tagicon" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/tags_50.png" alt="Tags" />
</span>
<span class="tagstyle spanchunk">
<strong>Kardeş Siteler:</strong> <a href="http://bedavasitem.forum.st" title="Bedavasitem Destek Forumu" rel="category">Bedavasitem.Forum.St</a> </span>
<span class="tagstyle ts-sm spanchunk">
<strong>Tema Düzenleme:</strong> Bedavasitem.Forum.St<br />
<strong>Son Güncelleme:</strong> 05 eyl 2008 @ 07 37 PM<br /><br />
<a rel="nofollow" href="mailto:webqolik@gmail.com">Email</a> •
<a href="http://www.bedavasitem.forum.st" rel="bookmark" title="Permanent Link to Hello world!">Permalink</a> •
<a href="http://www.bedavasitem.forum.st" title="Yorumla!">Yorum Yap</a> </span>
</div>
<div class="PFbtm"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt=" " /></div>
</div>
</div>
<hr class="rule" />

<div style="float:right;width:660px;">
<div class="navigation">
<div class="alignleft"></div>
<div class="alignright"></div>
</div>
</div><br /><br /><br />
<div style="clear:right;"></div>
</div>
</div>
<div class="clear"></div>
<div id="StartBaloon">
<img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/ardn_16.png" alt="/" /> Site Menüsü ...</div>
<div id="StartMenu" onclick="SMClkd();">
<div class="SMTop"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt=" " /></div>
<div class="SMMiddle">
<div class="SMsub">
<ul>
<li onclick="SMRaise(1);">
<a href="javascript: void(0)">
<img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/categories_32.png" alt=" " />
<b>Kategoriler</b><br />
Sitemizin Kategorileri... </a>
</li>
<li onclick="SMRaise(2);">
<a href="javascript: void(0)">
<img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/tags_32.png" alt=" " />
<b>Etiket Bulutu</b><br />
Etiket Bulutuna Bak... </a>
</li>
<li>
<a href="feed:http://bedavasitem.forum.st/feed/?type=atom">
<img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/feed_32.png" alt=" " />
<b>RSS</b><br />
RSS Beslemesine Abone Ol... </a>
</li>
<li>
<a href="http://bedavasitem.forum.st/roportajlar-f14/">
<img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/comments_32.png" alt=" " />
<b>Röportajlar</b><br />
BS Üyeleriyle Röportajlar... </a>
</li>
</ul>
<div class="SMsgbhr"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smhrlt.png" alt=" " /></div>
<div class="SMsgb" onclick="SMRaise(3);"><a href="javascript:void(0);"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smfwd.png" alt=" " />Son 10 Konu</a></div>
<div id="SMSearchForm"><form method="get" id="searchform" action="http://wp-themes.com/">
<div class="search-form">
<input onfocus="SearchBoxFocus();" onblur="SearchBoxBlur();" id="searchbox" type="text" value="" name="s" class="sm-search-text"/><input type="submit" id="searchsubmit" value="" class="sm-search-submit" />
</div>
</form>
</div>
</div>
<div class="SMsub SMsh" id="SMSub1">
<div class="SMSubDiv" style="padding:0;margin:4px 0 0 4px;">
<div class="SMCats"><ul> <li class="html"><a href="http://bedavasitem.forum.st/html-kodlar-f20/" title="En güzel html kodlar">HTML Kodları</a>
<ul class='children'>
<li class="Javascript"><a href="http://bedavasitem.forum.st/javascript-kodlar-f12/" title="Yeni Javascript Kodları">Javascript Kodları</a>
</li>
<li class="iconlar"><a href="http://bedavasitem.forum.st/konlar-conlar-f5/" title="İkonları">İconlar / Simgeler</a>
<ul class='children'>
<li class="ice blue"><a href="http://bedavasitem.forum.st/ice-blue-tasarmlar-f8/" title="ıce blue">Ice Blue Tasarımlar</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="css tema"><a href="http://bedavasitem.forum.st/css-tasarmlar-f11/" title="Bu temayı sitene kur">CSS Tasarımlar</a>
</li>
</ul></div>
<div class="SMsgbhr"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smhrlt.png" alt=" " /></div>
<div class="SMsgb" onclick="SMLower(1);"><a href="javascript:void(0);"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smback.png" alt=" " />Geri Dön</a></div>
</div>
</div>
<div class="SMsub SMsh" id="SMSub2">
<div class="SMSubDiv" style="padding:0;margin:4px 0 0 4px;">
<div class="SMTags SMCats">
<a href='http://bedavasitem.forum.st/ice-blue-tasarmlar-f8/' class='tag-link-12' title='1 topic' style='font-size: 8pt;'>Ice Blue Tema</a>
<a href='http://bedavasitem.forum.st/html-kodlar-f20/' class='tag-link-9' title='1 topic' style='font-size: 8pt;'>html Kodlar</a>
<a href='http://bedavasitem.forum.st/javascript-kodlar-f12/' class='tag-link-13' title='1 topic' style='font-size: 8pt;'>Javascript Kodları</a>
<a href='http://bedavasitem.forum.st/konlar-conlar-f5/' class='tag-link-13' title='1 topic' style='font-size: 8pt;'>İconlar</a>
<a href='http://bedavasitem.forum.st/index.htm' title='2 topics' style='font-size: 22pt;'>Bedavasitem</a> </div>
<div class="SMsgbhr"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smhrlt.png" alt=" " /></div>
<div class="SMsgb" onclick="SMLower(2);"><a href="javascript:void(0);"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smback.png" alt=" " />Back</a></div>
</div>
</div>
<div class="SMsub SMsh" id="SMSub3">
<div class="SMSubDiv SMap">
<ul> <li><a href='http://bedavasitem.forum.st/index.htm' title='Worth A Thousand Words'>Worth A Thousand Words</a></li>
<li><a href='http://bedavasitem.forum.st/index.htm' title='Elements'>Elements</a></li>
<li><a href='http://bedavasitem.forum.st/index.htm' title='More Tags'>More Tags</a></li>
<li><a href='http://bedavasitem.forum.st/index.htm' title='HTML'>HTML</a></li>
<li><a href='http://bedavasitem.forum.st/index.htm' title='Links'>Links</a></li>
<li><a href='http://bedavasitem.forum.st/index.htm' title='Category Hierarchy'>Category Hierarchy</a></li>
<li><a href='http://bedavasitem.forum.st/index.htm' title='Hello world!'>Hello world!</a></li>
</ul>
<div class="SMsgbhr"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smhrlt.png" alt=" " /></div>
<div class="SMsgb" onclick="SMLower(3);"><a href="javascript:void(0);"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/smback.png" alt=" " />Geri Dön</a></div>
</div>
</div>
<div class="SMRight">
<div class="SMAvatarB"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt=" " /></div>
<div class="SMAvatar">
<img alt='' src='http://www.gravatar.com/avatar/?d=identicon&s=46' class='avatar avatar-46 photo avatar-default' height='46' width='46' /> </div>
<div class="clear"></div>
<div class="SMAdmin">
<a class="SMRtHov" href="http://bedavasitem.forum.st/profile.forum?mode=register" title="Ücretsiz Kayıt Ol"><span>Ücretsiz Kayıt Ol</span></a> </div>
<div class="SMRtPoCom" onclick="SMFlot(5);">Tema Seçiniz...</div>
<div class="liload">
<div class="LogAdmin">
<ul>
<li class="loggedout"><span>[Logged Out]</span></li>
<li class="login"><a title="Login" href="http://bedavasitem.forum.st"><span>Login</span></a></li>
<li title="Blog Info" class="opts" onclick="SMFlot(4);"> </li>
</ul>
</div>
</div>
</div>
<div class="SMRtPoComFl SMsh" onclick="FlyOutWasClicked=1;" id="SMSub4">
<ul class="SMRtFlOpt SMRtFlOptInd">
<li><b>Üyeler</b> » 100</li>
<li><b>Kategoriler</b> » 18</li>
<li><b>Toplam Tema</b> » 39</li>
</ul>
</div>
<div class="SMRtOptsFl SMsh" onclick="FlyOutWasClicked=1;" id="SMSub5">
<div class="SMRtFlHd">Tema Seçiniz...</div>
<ul class="SMRtFlOpt">
<li title="Empty, dark and mysterious." onclick="chooseStyle('none', 30)"><img class="switchbutton voidb" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/void-button.png" alt="Void" title="Void" />Void <span style="font-size:9px">« Default</span></li>
<li title="The green bounty of life." onclick="chooseStyle('life-theme', 30)"><img class="switchbutton lifeb" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/life-button.png" alt="Life" title="Life" />Yeşil</li>
<li title="Subtle earth tones in browns and reds." onclick="chooseStyle('earth-theme', 30)"><img class="switchbutton earthb" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/earth-button.png" alt="Earth" title="Earth" />Earth </li>
<li title="Bright and refreshing sky tones." onclick="chooseStyle('wind-theme', 30)"><img class="switchbutton windb" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/wind-button.png" alt="Wind" title="Wind" />Wind </li>
<li title="The deep blue power of the ocean." onclick="chooseStyle('water-theme', 30)"><img class="switchbutton waterb" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/water-button.png" alt="Water" title="Water" />Ateş </li>
<li title="Intense red-orange, raging inferno." onclick="chooseStyle('fire-theme', 30)"><img class="switchbutton fireb" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/fire-button.png" alt="Fire" title="Fire" />Ateş </li>
<li title="Light on color and on bandwidth." onclick="chooseStyle('lite-theme', 30)"><img class="switchbutton liteb" src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt="Light" title="Light" />Light </li>
</ul>
</div>
</div>
<div class="SMBottom"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt=" " /></div>
</div>
<iframe src="javascript:false"
style="position:fixed; bottom: 32px; left: -200px; visibility:hidden; display: none; width: 174px; height: 128px; z-index: 5;"
id="hovif" frameborder="0" scrolling="no">
</iframe>
<iframe src="javascript:false"
style="position:fixed; bottom: 32px; left: -200px; visibility:hidden; display: none; width: 174px; height: 128px; z-index: 5;"
id="moif" frameborder="0" scrolling="no">
</iframe>
<iframe src="javascript:false"
style="position:fixed; bottom: 0px; left: -50px; visibility:hidden; display: none; width: 5000px; height: 34px; z-index: 5;"
id="tbif" frameborder="0" scrolling="no">
</iframe>
<iframe src="javascript:false"
style="background:transparent;position:fixed; bottom: 30px; left: -50px; visibility:hidden; display: none; width: 445px; height: 233px; z-index: 5;"
id="smif" frameborder="0" scrolling="no">
</iframe>
<iframe src="javascript:false"
style="position:fixed; bottom: 261px; left: 294px; visibility:hidden; display: none; width: 56px; height: 26px; z-index: 5;"
id="avif" frameborder="0" scrolling="no">
</iframe>
<iframe src="javascript:false"
style="position:fixed; bottom: 0px; left: -200px; visibility:hidden; display: none; width: 5px; height: 5px; z-index: 5;"
id="flif" frameborder="0" scrolling="no">
</iframe>

<div id="menuspan" class="mnusp">
<div class="menu">
<div class="nvtl"><ul><li onclick="OClkd();"><a><span>- O -</span></a></li></ul></div>

<div class="menu-sep"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt=" " /></div>
<div class="nav"><ul>
<li class="current_page_item_tb" ><a href="http://bedavasitem.forum.st">Anasayfa</a></li>
<li onmouseover="mhov(2,1)" onmouseout="munhov()" class="page_item page-item-2"><a href="http://wp-themes.com/?page_id=2" title="About">İletişim</a></li>
</ul>
</div>
<div class="clock">
<span id="clockhr"> </span>:<span id="clockmin"> </span> <span id="clockpart"> </span>
</div>
</div>
</div>
<div style="position:fixed;bottom:33px;left:0;"> <div onmouseover="hovmhov();" onmouseout="unhovmhov();" class="mhov" id="hov2">
<div class="mframe">
<h4 style="text-align:center;"><a href="http://bedavasitem.forum.st/contact.forum" title="About">İletişim</a></h4> <ul>
<br /><br />Bu Tema Bedavasitem.Forum.st Tarafından Tr.gg'ye uyarlanmıştır. Herhangi bir sorun durumunda bizimle iletişim kurabilirsiniz. </ul>
</div>
</div>
</div> <div class="clear"></div>
<div class="footer"><img src="http://wp-themes.com/wp-content/themes/inanis-glass/images/1pxtrans.gif" alt=" " /></div>
<script type="text/javascript">
document.getElementById('menuspan').style.zIndex = "10";
document.getElementById('StartMenu').style.zIndex = "10";
</script>
</body>
</html>

Css Style Kodları

Tasarım Üzerine Ekle

Tasarım Altına Ekle

Css Style Kodalrına Ekle

Tasarım Üzerine Ekle

Tasarım Altına Ekle

Css Style Kodalrına Ekle

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background: url(http://www.backgroundlabs.com/backgrounds/151.jpg); text-align: center; } #design { width: 900px; margin-left: auto; margin-right: auto; text-align: left; } #top{ margin-left: auto; margin-right: auto; background: url(https://img.webme.com/pic/t/tasarimlife/gri_01.gif); width: 900px; height: 214px; float: left; } .logo { width:335px; height:65px; backround:url(Başlık Resmi Buaraya!!); padding: 1px 0 0 5px; float: left; } .reklam { width:450px; padding: 2px 0 0 50px; float: left; } .ustmenu { width:880px; padding: 20px 0 0 20px; float: left; } #icerik { margin-left: auto; margin-right: auto; background: url(https://img.webme.com/pic/t/tasarimlife/gri_02.gif); float: left; overflow:hidden ; } #icontent { width: 895px; padding: 0 0 0 5px; overflow:hidden ; float: left; } .sagmenu { width: 200px; padding:4px 0 0 15px; float: left; overflow: hidden; text-align: justify; } .yazialani { width: 660px; padding: 0 0 0 5px; float: left; overflow: hidden; } #alts{ margin-left: auto; margin-right: auto; background: url(https://img.webme.com/pic/t/tasarimlife/gri_03.gif); width: 900px; height: 194px; float: left; } .copyright { width: 450px; padding:60px 0 0 450px; float: left; overflow: hidden; text-align: justify; }

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

arkadaşlar şok program ice blue red butterfly tasarım yapabiliorsunuz hemde çok basit işte programın anlatımı

ice blue tasarım yapmak için

butterfly yapmak için burda url leri yapıştırıoruz yabancı kelimelerin anlamlarını yanlarına yazdım butterflydekilerin aynısı red için de geçerlidir o ndnle sadece butterflyda türkçe çeviri var. işte butterfly ve red için

arkadaşlar css uyarlıyıcısıda çok basit kullanımı onun resimli anlatımını yapmadım normal anlatıcam yapamazsanız resimlide anlatabilirim anlatıma başlıorum

programı açıp css yi seçtikten sonra açılan pencereden empezar tuşuna basıoruz sonra yine açılan pencerenden abrir archivo dioruz sonra tasarımın style dosyasını bulup ona tıklıyoruz sonra paso 2 ye tıklıoruz karşımıza gelenden yine abrir archivoyu tıklıyoruz bu sefer tasarımın index dosyasını seçioruz ardından çıkan pencerenden pasa3 tıklıyoruz çıkan pencerenden genrar codigo yu tıklıoruz karşımıza çıkan penceredeki en üstteki tasarım üstü onun altındaki tasaırm altı yan taraftaki css koduna gelicek koddur.

anlatım bukadar şimdi bu muhteşem program

LİNK:
http://www.dosya.tc/Pwg_Maker_v4.rar.html

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

Css Tasarım Yapma Videolu Anlatım

dosya şifresi: www.endlessgenclik.com

http://rapidshare.com/files/266079140/anlatim.rar

video ile ilgili sorun yaşayan arkadaşlar olmuş

videoyu sorunsuz izlemek için : http://www.videolan.org/mirror-geo.php?file=vlc/1.0.1/win32/vlc-1.0.1-win32.exe

programını kurun

CSS Tasarımlar1

Tasarımların Bazıları Alıntıdır