Tasarimin Üzerine
<div id="outer"> <div id="outer2"> <div id="header"> <h1>Site Adı</h1> <h2>By CSS Merkez</h2> </div> <div id="menu"> <ul> <li><a href="#">Ana Sayfa</a></li> <li><a href="#">Z.Defteri</a></li> <li><a href="#">Servis</a></li> <li><a href="#">İletişim</a></li> <li><a href="#">Toplist</a></li> </ul> </div> <div id="content"> <div id="column1"> <h3>Sitemize Hoşgeldiniz</h3>
Tasarimin ALtına
</div> <div id="column2"> <h3>Ana Menu</h3> <ul> <li><a href="#">Ana Sayfa</a></li> <li><a href="#">Ziyaretci Defteri</a></li> <li><a href="#">Servis</a></li> <li><a href="#">İletişim</a></li> <li><a href="#">Toplist</a></li> <li><a href="#">Css Design</a></li> <li><a href="#">Link Listesi</a></li> <li><a href="#">Diğer Konular</a></li> </ul> <h3>Diğer Konular</h3> <ul> <li><a href="#">Fikralar</a></li> <li><a href="#">Ne Nedir</a></li> <li><a href="#">Dersler</a></li> <li><a href="#">Html Kodlari</a></li> </ul> </div> </div> <div id="footer"> <p>Copyright © 2009 SiteDostlugu.tr.gg Design by <a href="http://www.css-merkez.tr.gg">Css Tasarim Merkezi</a>.</p> </div> </div> </div>
Css Kod 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;}* { margin: 0em; padding: 0em; } a { color: #8DA359; text-decoration: underline; } a:hover { text-decoration: none; } body { background-color: #F0E3A4; background-image: url('http://img.webme.com/pic/c/css-merkez/css-12-a4.gif'); background-repeat: repeat-x; color: #37371E; font-family: georgia, serif; font-size: 10pt; } #outer { width: 760px; margin-left: auto; margin-right: auto; margin-top: 1.0em; background-color: #FEFEF2; background-image: url('http://img.webme.com/pic/c/css-merkez/css-12-a3.gif'); background-repeat: repeat-x; padding: 1.0em; border-top: solid 1px #ffffff; margin-bottom: 1.0em; } #outer2 { border: dotted 1px #EFEAD1; padding: 1.0em; } #menu { background-color: #6C7424; background-image: url('http://img.webme.com/pic/c/css-merkez/css-12-a1.gif'); background-repeat: repeat-x; color: #ffffff; height: 1.4em; line-height: 1.4em; padding: 0.8em; border-bottom: solid 1px #ffffff; border-top: solid 1px #6D7B34; } #menu a { color: #ffffff; text-decoration: none; } #menu ul { list-style: none; padding: 0em; } #menu li { display: inline; font-size: 0.9em; font-weight: bold; } #menu li a { padding: 0.8em; } #menu li a:hover { background-color: #515815; background-image: url('http://img.webme.com/pic/c/css-merkez/css-12-a2.gif'); background-repeat: repeat-x; } #header { padding: 0.8em 1.2em 1.2em 1.2em; } #header h1 { font-size: 3.0em; text-transform: lowercase; font-weight: normal; letter-spacing: -0.05em; } #header h2 { position: relative; top: -0.1em; text-transform: lowercase; font-size: 0.8em; color: #4F4F2B; } #content { margin-top: 1.0em; padding: 1.2em; line-height: 2.2em; font-size: 0.9em; position: relative; } #footer { border-top: dashed 1px #EFEFD6; padding-top: 1.0em; font-size: 1.0em; color: #AFA162; padding-left: 1.2em; clear: both; } #column1 { width: 530px; float: left; position: relative; } #column1 p { text-align: justify; margin-bottom: 2.0em; color: #4F4F2B; } #column1 h3 { font-size: 1.2em; border-bottom: dashed 1px #CECF8F; margin-bottom: 1.0em; } #column2 { width: 145px; float: right; position: relative; margin-left: auto; } #column2 p { text-align: justify; margin-bottom: 2.0em; color: #4F4F2B; font-size: 1.0em; } #column2 h3 { font-size: 1.1em; border-bottom: dashed 1px #CECF8F; margin-bottom: 1.0em; } #column2 ul { list-style: none; line-height: 2.0em; margin-bottom: 2.0em; } #column2 li { border-bottom: dashed 1px #EFEFD6; }
______________
