- Css-Design

Bunu KuLLanmak İçin Css-Design Tasarımını Seçiyoruz...

Css Kodu Dediği Yere

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;} body { background-color: #cccccc; }
Kodunu Ekliyoruz.
Hangi Sayfaya Ekliyeceksekte .

<p> <table height="600" cellspacing="1" cellpadding="1" width="800" border="1"> <tbody> <tr> <td bgcolor="#cccccc"> <table height="100" cellspacing="2" cellpadding="2" width="800" border="1"> <tbody> <tr> <td><img class="" alt="" src="http://child.tasarim.googlepages.com/cssbaslikdeneme1.png" _fcksavedurl="http://child.tasarim.googlepages.com/cssbaslikdeneme1.png" /></td> </tr> </tbody> </table> <p> <table height="83" cellspacing="1" cellpadding="1" width="137" border="1"> <tbody> <tr> <td valign="top" align="left" bgcolor="#f6ac1f"><strong><a href="#" _fcksavedurl="#"><font color="#000000">Linkin İsmi</font></a></strong></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> <tr> <td bgcolor="#f6ac1f"><a href="#" _fcksavedurl="#"><font color="#000000"><strong>Linkin İsmi</strong></font></a></td> </tr> </tbody> </table> </p> <p><br /> </p> </td> </tr> </tbody> </table> </p> <table style="width: 514px; height: 40px" height="40" cellspacing="4" cellpadding="4" width="514" border="1"> <tbody> <tr> <td bgcolor="#cccccc"><font face="Times New Roman" color="#ff0000" size="4">Desing BY CHİLD-TASARİM <a target="_blank" href="http://www.child-tasarim.tr.gg" _fcksavedurl="http://www.child-tasarim.tr.gg">www.child-tasarim.tr.gg</a></font></td> </tr> </tbody> </table>

Tasarımın Üzerine

..

<div id="Testdesign2"> <div id="Header_oben"></div>

Tasarımın Altına

<div id="Streifen_unten"></div></div>

Css Kodu (Style Tagları OLmadan Yazınız)

h1#title{display: none;} h2#title span {display: none;} div.header{display: none;} li.nav_element{list-style-type: none;} * { padding: 0; margin: 0; } #Testdesign2 { margin: 0 auto; width: 922px;} #sidebar_container { height: 320px; width: 137px; background: #C0C0C0; background-image:url(http://child.tasarim.googlepages.com/greengreybox.png); color: #a8ff00; border: 0px solid #6E6E6E; margin: 0px 0px 0px 0px; padding: 10px; float: left; overflow:auto;} #Header_oben { color: #333; width: 900px; height: 129px; float: left; padding: 10px; border: 0px solid #80807F; margin: 10px 0px 0px 0px; background-image: url(http://child.tasarim.googlepages.com/greengreyheader.png); background: #xxxxxx;} #content { color: #000000; border: 0px solid #80807F; margin: 0px 0px 0px 0px; padding: 10px; height: 320px; width: 558px; float: left; background-image:url(http://child.tasarim.googlepages.com/greengreycontent.png); overflow:auto;} #nav_container { color: #000000; border: 0px solid #07417C; background: #FFFFFF; margin: 0px 0px 0px 0px; padding: 0px; height: 340px; width: 186px; background-image: url(http://child.tasarim.googlepages.com/greengreyleft.png); float: left; overflow:auto;} #Streifen_unten { width: 900px; clear: both; color: #333; border: 0px solid #80807F; background-image:url(http://child.tasarim.googlepages.com/greengreyfooter.png); margin: 0px 0px 10px 0px; padding: 10px; height: 20px;} #counter{text-align:center;} li.nav_element a{ color:#a8ff00; text-align:center; display: block; margin: 5px; padding: 10px; text-decoration: none; width: 156px; height: 15px; background-image:url(http://child.tasarim.googlepages.com/greengreynormal.png); background-color:#FDC600;} li.nav_element a:hover{ color:#0000000; display: block; margin: 5px; padding: 10px; text-decoration: none; width: 156px; height: 15px; background-image:url(http://child.tasarim.googlepages.com/greengreyhover.png); background-color:#FDC600;} body {background-color:#000000;} a{color:#000080; font-size: 14px; text-decoration: none;} a:hover {color: #000080; font-size: 14px; text-decoration: none;} a:link {color: #000080; font-size: 14px; text-decoration: none;} a:active {color: #000080; font-size: 14px; text-decoration: none;} a:visited {color: #000080; font-size: 14px; text-decoration: none;}

Tasarımın Üstüne

Css Bölümüne

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;}
/**************************************************/
/* Body and Wrapper */
/**************************************************/
body {
background: #feae31 url(http://www.ww64.com/uploads/images/2008-09-27/F7Iu2sKGh5.png) top center repeat-x;
margin: 0;
padding: 0;
font: normal 8pt/13pt verdana, arial,sans-serif;
}
#wrapper {
margin: 0 auto;
width: 800px;
padding: 0;
text-align: left;
}
/**************************************************/
/* Top Piece */
/**************************************************/
#top {
background: url(http://www.ww64.com/uploads/images/2008-09-27/NwdQzmYl31.png) top center no-repeat;
width: 800px;
height: 78px;
}
/**************************************************/
/* Content
another wrapper that holds all the content */
/**************************************************/
#content {
background: url(http://www.ww64.com/uploads/images/2008-09-27/kDuWDgI3eH.png) center repeat-y;
width: 766px;
height: 100%;
padding: 0px 17px 0px 17px;
}
/**************************************************/
/* All the content */
/**************************************************/
#header {
background: url(http://www.ww64.com/uploads/images/2008-09-27/pxoPJsUbVF.png) top center no-repeat;
width: 746px;
height: 106px;
margin: 0px 0px 10px 0px;
padding: 60px 0px 0px 20px;
color: white;
font-size: 50px;
text-align: ;
}
/* Menu */
#menu {
width: 200px;
height: 100%;
margin-left: 10px;
float: left;
text-align: left;
}
#menu li a {
height: 37px;
voice-family: ""}"";
voice-family: inherit;
height: 29px;
text-decoration: none;
text-align: left;
}
#menu li a:link, #menu li a:visited {
color: navy;
display: block;
background: url(http://www.ww64.com/uploads/images/2008-09-27/4iQ3KSuuAi.png) top center no-repeat;
padding: 8px 0 0 10px;
height: 29px;
text-align: left;
}
#menu li a:hover {
color: ORANGE;
background: url(http://www.ww64.com/uploads/images/2008-09-27/zcXwkclu2v.png) top center no-repeat;
padding: 8px 0 0 10px;
height: 29px;
text-align: left;
}
ul {
list-style: none;
margin: 0;
padding: 0;
text-align: left;
}
#stuff {
background: url(http://www.ww64.com/uploads/images/2008-09-27/n71fbODvIc.png) top left no-repeat;
width: 520px;
margin: 0px 0px 0px 220px;
padding-top: 55px;
border: 2px navy;
}
img {
border: none;
}
/**************************************************/
/* Bottom */
/**************************************************/
#bottom {
background:  none bottom center no-repeat;
width: 800px;
height: 50px;
}

Css-4

Css Bölümüne

Ekliyeceğiniz Sayfaya

<table height="100" cellspacing="1" cellpadding="1" width="920" border="1">
<tbody>
<tr>
<td valign="top" align="left" bgcolor="#e1e1e1">
<table cellspacing="1" cellpadding="1" width="920" border="1">
<tbody>
<tr>
<td><img class="" height="153" alt="" width="920" src="http://www.ww64.com/uploads/images/2008-10-04/ROFgn7tn7E.png" _fcksavedurl="http://www.ww64.com/uploads/images/2008-10-04/ROFgn7tn7E.png" /></td>
</tr>
<tr>
<td valign="top" bgcolor="#e1e1e1" li.item_active="" ul="" li="" a:visited="" img369.imageshack.us="" img369="" img225.imageshack.us="" img225="" no-repeat="" right="" a="" solid="" background-position:left="" a:hover="" span="">
<div id="MainMenu">
<div id="tab"> <img class="" alt="" src="http://www.ww64.com/uploads/images/2008-10-04/FYN4etXZdu.png" _fcksavedurl="http://www.ww64.com/uploads/images/2008-10-04/FYN4etXZdu.png" /></div>
</div>
<center></center></td>
</tr>
</tbody>
</table>
<table height="198" cellspacing="1" cellpadding="1" width="200" align="left" border="0">
<tbody>
<tr>
<td valign="top" align="left" bgcolor="#e1e1e1">
<p><img class="" height="29" alt="" width="194" src="http://www.ww64.com/uploads/images/2008-10-04/ECJ0rDMJZ4.png" _fcksavedurl="http://www.ww64.com/uploads/images/2008-10-04/ECJ0rDMJZ4.png" /> <br />
<strong><font color="#ffffff">Linkin Adı</font></strong> <br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<font color="#ffffff"><strong>Linkin Adı</strong></font><br />
<br />
 <br />
 <br />
 <br />
 <br />
 </p>
</td>
</tr>
<tr>
<td valign="top" align="left" bgcolor="#e1e1e1"><noscript></noscript></td>
</tr>
<tr>
<td valign="top" align="left" bgcolor="#e1e1e1">
<div align="center"> </div>
</td>
</tr>
<tr>
<td valign="top" align="left" width="721" height="398" border="1" cellpadding="1"> </td>
</tr>
</tbody>
<tbody>
<tr>
<td valign="top" align="left" bgcolor="#e1e1e1">
<p align="left"></p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>