Pusu Vadisi - CSS Design 9

Screan Shoot

Tasarımın Üzerindeki Yazı

<!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" dir="ltr"> <head profile="http://gmpg.org/xfn/11"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="description" content="description"/> <meta name="keywords" content="keywords"/> <meta name="author" content="author"/> <title>Hazax Tasarim - www.Hazax.De.TL</title> <style type="text/css"> /* Template name: Colorvoid - Hazax Tasarim - www.Hazax.De.TL */ /* ---------------------------------------- Standard Elements ------------------------------------------- */ * { margin: 0; padding: 0; } html { height: 100%; padding-bottom: 1px; /* force scrollbars */ } body { background: #404040 url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidbody.jpg'); font: normal 13px Verdana,sans-serif; color: #345; padding-bottom: 1em; } a {color: #06A;} a:hover {color: #036;} p {padding: 0.1em 0 0.8em;} h1 {font: normal 1.8em Georgia,Tahoma,sans-serif;} h2 {font: normal 1.5em Georgia,sans-serif;} h3 {font: bold 1em Tahoma,sans-serif;} hazaxcolorvoidblockquote { background: #FFF url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidq.gif') no-repeat; border: 1px solid #EAEAEA; color: #555; display: block; font: normal 1em sans-serif; margin-bottom: 1em; padding: 10px 1em 0.2em 42px; } hazaxcolorvoidcode { display: block; background: #FFFFFA; color: #335; border: 1px solid #E8E8D5; padding: 5px 10px; overflow: auto; margin: 1em 0; font-size: 0.9em; line-height: 1.5em; } ul,ol {margin: 0 0 1em 1.6em;} ul ul, ol ol {margin: 0.3em 0 0.3em 1em;} img {border: none;} img.bordered {background: #FFF; padding: 5px; border: 1px solid #DDD;} img.left {margin-right: 1em;} img.right {margin-left: 1em;} small,.small {font-size: 0.8em;} big,.big {font-size: 1.2em;} /* ---------------------------------------- Forms ------------------------------------------- */ /* Inputs */ input#hazaxcolorvoids, textarea, input.styled { border: 1px solid #BBB; padding: 3px; width: 160px; font: normal 1em Verdana,sans-serif; } textarea {width: 440px;} #hazaxcolorvoidsearchsubmit { border: 1px solid #BBB; background: #EEE; font: normal 0.9em Verdana,sans-serif; padding: 2px 3px; } /* Seachform */ table.search { width: 100%; border-collapse: collapse; } .search td {vertical-align: center;} /* ---------------------------------------- Layout ------------------------------------------- */ /* Main */ #hazaxcolorvoidlayout_wrapper { margin: 40px auto 0; width: 780px; } #hazaxcolorvoidlayout_container { background: #FFF; padding: 0 5px; } #hazaxcolorvoidlayout_edgetop, #hazaxcolorvoidlayout_edgebottom { background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidlayout_edges.gif') no-repeat left top; display: block; height: 10px; font-size: 0; line-height: 0; } #hazaxcolorvoidlayout_edgebottom {background-position: left bottom;} /* Site Title */ #hazaxcolorvoidsite_title { background: #C5DEF0 url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidsite_title.jpg') repeat-x left top; padding: 6px 18px; } #hazaxcolorvoidsite_title h1 { font: normal 2.4em sans-serif; letter-spacing: -1px; } #hazaxcolorvoidsite_title h1,#hazaxcolorvoidsite_title h1 a {color: #507A9A;} #hazaxcolorvoidsite_title h1 a {text-decoration: none;} #hazaxcolorvoidsite_title h1 a:hover {color: #305A7A} #hazaxcolorvoidsite_title h2 { padding-top: 1.4em; font: normal 1.1em sans-serif; color: #679; } #hazaxcolorvoidtop_separator { background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidtop_s.gif') repeat-x left top; display: block; font-size: 0; height: 3px; line-height: 0; } /* Navigation */ #hazaxcolorvoidnavigation { background: #739CBA url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidnavigation.jpg') no-repeat left bottom; padding: 82px 10px 0; } /* Tabs */ #hazaxcolorvoidtabs ul { margin: 0; padding: 0; } #hazaxcolorvoidtabs li { display:inline; list-style:none; } #hazaxcolorvoidtabs a { background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidtableftc.gif') no-repeat left top; float: left; font: bold 0.9em sans-serif; margin-right: 3px; padding-left: 4px; text-decoration: none; } #hazaxcolorvoidtabs a span { float: left; display: block; background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidtabrightc.gif') no-repeat right top; padding: 5px 10px 5px 6px; color: #608AAA; } /* Commented Backslash Hack hides rule from IE5-Mac */ #hazaxcolorvoidtabs a span {float: none;} /* End IE5-Mac hack */ #hazaxcolorvoidtabs a:hover span {color: #608AAA;} #hazaxcolorvoidtabs a:hover {background-position: 0% -42px;} #hazaxcolorvoidtabs a:hover span {background-position:100% -42px;} #hazaxcolorvoidtabs li.current_page_item a {color: #47A; background-position: 0% -42px;} #hazaxcolorvoidtabs li.current_page_item a span {background-position:100% -42px;} /* Main Layout */ #hazaxcolorvoidmain_left {width: 545px;} #hazaxcolorvoidmain_right {width: 220px;} /* Footer */ #hazaxcolorvoidfooter { background: #A3B5C1 url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidfooter.gif') no-repeat left top; padding: 8px 12px 2px; font-size: 0.85em; color: #FAFCFF; } #hazaxcolorvoidfooter .right {color: #C8DBE8;} #hazaxcolorvoidfooter .right a { color: #D3E5F1; text-decoration: none; } #hazaxcolorvoidfooter .right a:hover { color: #FFE; text-decoration: underline; } /* ---------------------------------------- Miscellaneous ------------------------------------------- */ /* Images */ img.bordered { border: 1px solid #DDD; background: #FFF; padding: 5px; } /* Text */ .bold {font-weight: bold;} .tright {text-align: right;} .tcenter {text-align: center;} .tright {text-align: right;} /* Floats */ .left {float: left;} .right {float: right;} /* Clear */ .clear,.clearer {clear: both;} .clearer,.spacer { display: block; font-size: 0; line-height: 0; } /* Icons */ span.comment { background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidicon_comment.gif') no-repeat left center; padding-left: 18px; } /* ---------------------------------------- Post, page ------------------------------------------- */ .post { margin-bottom: 5px; color: #444; } .post_title { background: #E8E8E8 url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidposttitle.gif') no-repeat left top; padding: 6px 12px 5px; } .post_title h1 {font: bold 0.9em Verdana,sans-serif;} .post_title h1 a {color: #444;} .post_title h1 a:hover { color: #469; text-decoration: underline; } .post_title h1.left {width: 380px} .post_date { color: #999; padding-top: 1px; font-size: 0.85em; } .post_metadata { margin-top: 5px; padding: 0 5px; background: #F5F5F5; } .post_metadata .content { border-top: 1px solid #E5E5E5; padding: 8px 5px 6px; font-size: 0.8em; color: #666; } .post_metadata .content a {color: #567;} .post_metadata .content a:hover {color: #002;} .post_body { background: #F5F5F5 url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidpostbody.gif') repeat-x left top; padding: 10px 10px 1px; } .post_body img { border: 1px solid #CCC; background: #FFF; padding: 3px; } .post_bottom { background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidpostbottom.gif') no-repeat left top; display: block; height: 5px; font-size: 0; line-height: 0; } .post_search_text { font-size: 0.85em; padding: 2px 0; } /* ---------------------------------------- Sidebar box ------------------------------------------- */ .box {margin-bottom: 5px;} .box_title { background: #C6D2DB url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidboxtitle.gif') no-repeat left top; padding: 6px 10px 5px; font-weight: bold; font-size: 0.9em; color: #505E69; } .box_body { background: #DAE3E9 url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidboxbody.gif') repeat-x left top; padding: 8px 10px 1px; font-size: 0.9em; } .box_bottom { background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidboxbottom.gif') no-repeat left top; display: block; height: 5px; font-size: 0; line-height: 0; } .box ul { margin-left: 0; border-bottom: 1px solid #E2ECF2; } .box li:first-child {border-top: none;} .box ul li { list-style: none; padding: 4px; border-top: 1px solid #E2ECF2; border-bottom: 1px solid #D0D8DE; } .box ul a {text-decoration: none;} .box ul a:hover {text-decoration: underline;} /* ---------------------------------------- Lists ------------------------------------------- */ .nicelist { padding: 1px 0 0; } .nicelist ol {margin: 0;} .nicelist ol li { list-style: none; padding: 8px 10px 1px; border-top: 1px solid #FFF; border-bottom: 1px solid #CCC; } .nicelist li.alt {background: #EEE;} .nicelist .body {padding-top: 5px;} .nicelist .date { color: #888; padding-top: 4px; font-size: 0.85em; } .nicelist .date a { color: #567; text-decoration: none; } .nicelist .date a:hover { color: #002; text-decoration: underline; } /* ---------------------------------------- Archives ------------------------------------------- */ .archive_title {font: normal 1.4em sans-serif;} .archive_title a {text-decoration: none;} .archive_title a:hover {text-decoration: underline;} .archive_postinfo { font: normal 1em sans-serif; padding-bottom: 6px; } /* ---------------------------------------- Comments ------------------------------------------- */ .comment_gravatar {width: 48px;} .comment_gravatar img {padding: 2px;} .comment_author {padding-top: 2px;} /* ---------------------------------------- Pagination ------------------------------------------- */ .pagenavigation { background: #DDEBF4 url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidpagenav_top.gif') no-repeat; margin-bottom: 5px; } .pagenav_bottom { display: block; font-size: 0; line-height: 0; height: 5px; background: url('https://img.webme.com/pic/h/hazax/hazaxcolorvoidpagenavb.gif') no-repeat; } .pagenav { font-size: 0.85em; padding: 5px 8px 0; } .pagenav a { color: #6A7DA4; text-decoration: none; } .pagenav a:hover { color: #002; text-decoration: underline; } /* ---------------------------------------- Width, height, margin, padding ------------------------------------------- */ .h5 {height: 5px;} .p5 {padding: 5px;} .p10 {padding: 10px;} </style>  </head> <body> <div id="hazaxcolorvoidlayout_wrapper"> <div id="hazaxcolorvoidlayout_edgetop"></div> <div id="hazaxcolorvoidlayout_container"> <div id="hazaxcolorvoidsite_title"> <h2 class="right">Web Sitemize Hos Geldiniz</h2> <div class="clearer"> </div> </div> <div id="hazaxcolorvoidtop_separator"></div> <div id="hazaxcolorvoidnavigation"> <div id="hazaxcolorvoidtabs"> <ul> <li class="current_page_item"><a href="http://www.hazax.de.tl"><span>Hazax</span></a></li> <li><a href="#"><span>Link 0</span></a></li> <li><a href="#"><span>Link 1</span></a></li> <li><a href="#"><span>Link 2</span></a></li> <li><a href="#"><span>Link 3</span></a></li> <li><a href="#"><span>Link 4</span></a></li> <li><a href="#"><span>Link 5</span></a></li> <li><a href="#"><span>Link 5</span></a></li> </ul> <div class="clearer"> </div> </div> </div> <div class="spacer h5"></div> <div id="hazaxcolorvoidmain"> <div class="left" id="hazaxcolorvoidmain_left"> <div id="hazaxcolorvoidmain_left_content"> <div class="post"> <div class="post_title"> <h1>CSS Design 9</h1> </div> <div class="post_body"> <p>

Tasarımın Altındaki Kod

</p> </div> </div> </div> </div> <div class="right" id="hazaxcolorvoidmain_right"> <div id="hazaxcolorvoidsidebar"> <div class="box"> <div class="box_title">Arama</div> <div class="box_body"> <form method="get" id="hazaxcolorvoidsearchform" action="#"> <div> <table class="search"> <tr> <td><input type="text" value="" name="s" id="hazaxcolorvoids" /></td> <td style="padding-left: 10px"><input type="image" src="https://img.webme.com/pic/h/hazax/hazaxcolorvoidbutton_go.gif" /></td> </tr> </table> </div> </form> </div> <div class="box_bottom"></div> </div> <div class="box"> <div class="box_title">Extra Link</div> <div class="box_body"> <ul> <li><a href="#">1. Sayfa</a> (5)</li> <li><a href="#">2. Sayfa</a> (2)</li> <li><a href="#">3. Sayfa</a> (8)</li> <li><a href="#">4. Sayfa</a> (10)</li> </ul> </div> <div class="box_bottom"></div> </div> <div class="box"> <div class="box_title">Haber</div> <div class="box_body p10"> Kutuya Bir Cumle Yazin. </div> <div class="box_bottom"></div> </div> </div> </div> <div class="clearer"> </div> </div> <div id="hazaxcolorvoidfooter"> <div class="left">Copyright By © 2008 Hazax</div> <div class="right"><a href="http://www.hazax.de.tl">Site Tasarimcisi</a> by <a href="http://www.hazax.de.tl">Hazax</a></div> <div class="clearer"> </div> </div> </div> <div id="hazaxcolorvoidlayout_edgebottom"></div> </div> </body> </html>

CSS Kodu Bölümüne

td.nav {visibility:hidden;} li.nav_element{display: none;} td.headline2 {visibility:hidden;} td.nav_element checked_menu {visibility:hidden;} td.content_container{visibility:hidden;} #extraDiv1 {display: none;} #extraDiv2 {display: none;} #extraDiv3 {display: none;} #extraDiv4 {display: none;} #extraDiv5 {display: none;} #extraDiv6 {display: none;} #pre_header {display: none;} #post_header {display: none;} #pre_content {display: none;} #nav_heading{display: none;} div.header{display: none;} h1#title{display: none;} h2#title span {display: none;} td.nav {visibility:hidden;} li.nav_element{display: none;} td.headline2 {visibility:hidden;} td.nav_element checked_menu {visibility:hidden;} td.content_container{visibility:hidden;} h2#title span {display: none;} div.header{display: none;} li.nav_element{list-style-type: none;} li.nav_element{display: none;} td.nav {visibility:hidden;} li.nav_element{display: none;} td.headline2 {visibility:hidden;} td.nav_element checked_menu {visibility:hidden;} td.content_container{visibility:hidden;}