Css Kodları --
Style.css
/* Bu Dosya Mertcan Eyriyer tarafından kodlanmıştır */
/* Standart Kodlar */
@font-face {
font-family: 'OpenSans-Semibold';
src: url('OpenSans-Semibold.eot?') format('eot'),
url('OpenSans-Semibold.woff') format('woff'),
url('OpenSans-Semibold.ttf') format('truetype'),
url('OpenSans-Semibold.svg#OpenSans-Semibold') format('svg');
}
/* Standart Kodlar */
/* Genel */
#genel {width: auto; margin: 0 auto}
/* Header */
#header {height: 53px; width: auto; background-color: #fff; margin: auto 0; border: 1px solid #d5d5d5}
/* Logo */
.logo {position: absolute; margin-top: 18px; margin-left: 100px;}
/* Menü */
.menu {position: absolute;}
.menu {top: 16px; left: 1177px; font-family: "OpenSans-Semibold"; color: #999;}
.menu ul li {float: left; width: 110px; text-align: center;}
.menu ul li a {font-size: 16px; color:#333333;}
.menu ul a:hover , .menu ul a:active {color: #333; text-decoration: none; border-bottom: 3px solid #333; transition: all .1s linear;}
/* İçerik */
.icerik {height: 608px; width: 1090px; background-color: #fff; margin-left: 100px; margin-top:80px; border: 1px solid #d5d5d5; overflow: auto;}
/* Sidebar */
.sidebar {height: 300px; width: 300px; background-color: #fff; margin-left: 1200px; margin-top:-610px; border: 1px solid #d5d5d5;}
/* Sidebar Çizgi */
.sidebarcizgi {height: 1px; width: 302px; background-color: #d5d5d5; margin-left: 1200px; margin-top:-563px;}
/* Facebook */
.fb {position: absolute; margin-top: 8px; margin-left: 1108px;}
/* Twitter */
.tw {position: absolute; margin-top: 8px; margin-left: 1145px;}
/* You Tube */
.yt {position: absolute; margin-top: 8px; margin-left: 1182px;}
/* G Plus */
.gp {position: absolute; margin-top: 8px; margin-left: 1219px;}
/* Sidebar 2 */
.side {height: 300px; width: 300px; background-color: #fff; margin-left: 1200px; margin-top:6px; border: 1px solid #d5d5d5;}
/* Blog Çubuk */
.blogcubuk {height: 1px; width: 1090px; background-color: #d5d5d5; margin-left: 0px; margin-top:46px;}
/* Blog İkon */
.blogikon {position: absolute; margin-top: -38px; margin-left: 8px; color: #333}
/* Arama */
.arama {width: 180px; height: 40px; background: #fff; margin-left: 1215px;}
.aramabuton {background: #fff; height: 40px; width: 93px; border-left: 1px solid #d5d5d5; margin-left: 1110xp; font-size: 13px; color: #a6a6a6;}
.aramabuton:hover {background: #fff; height: 40px; width: 93px; border-left: 1px solid #d5d5d5; font-size: 13px; color: #727272;}
.aramacizgi {height: 1px; width: 300px; background-color: #d5d5d5; margin-left: 1200px;}
/* Header */
Reset.css
/* Sıfırlamalar */
body{background: url(resim/bg.png) ;margin: auto;}
ul, li, ol, table, tr, td,h1, h2, h3, h4, h5, h6, p, form, input, select, textarea, button, img{padding: 0; margin: 0; border: 0; list-style: none}
a {text-decoration: none}
*:focus {outline: 0}
.clear {clear: both}
h3{margin-left: 43px; margin-top: -28px; font-size: 16px; font-family: 'OpenSans-Semibold';}
p{font-size: 14px; font-family: 'OpenSans-Semibold'}
a {color:#fff;text-decoration: none;}
Html Kodlar--
İndex.html
Mertcan
Demo Adresi : Lütfen Tıklayın