BHA-TASARIM VE DANIŞMANLIK - GRI BORDO SIYAH CSS TASARIM

GRI BORDO SIYAH CSS TASARIM

csstemplateworld2.tr.gg sitesine ait tasarım

Dinamik sayfa geçişi
Turuncu ağırlıklı renk renk
2 sütunlu
Çok Boyutlu site

Tasarım Üstüne

<-Bu Kodu Tasarım Üstüne Koy-><div id="main">

<div id="header">
<div id="buttons">
<a href="#" _fcksavedurl="#" class="but"  title="">Ana Sayfa</a><div class="but_p"></div>
<a href="#" _fcksavedurl="#" class="but" title="">Link 1</a><div class="but_p"></div>
<a href="#" _fcksavedurl="#"  class="but" title="">Link 2</a><div class="but_p"></div>
<a href="#" _fcksavedurl="#"  class="but" title="">Hakkımızda</a><div class="but_p"></div>
<a href="#" _fcksavedurl="#" class="but" title="">İletişim</a>
</div></br>
<div id="box_all">
<div class="box box1">
<h1>Başlık1</h1>
<div class="text"><img src="https://img.webme.com/pic/c/csstemplateworld2/img1.jpg" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/img1.jpg" width="90" height="60" class="img_box" alt="" /><span class="r">Lorem ipsum dolor sit amet, consectetur adipiscing elit. </span><br />
Duis consectetur neque nec quam posuere non vehicula felis tincidunt. Sed in erat et leo convallis rhoncus. Ves- tibulum porta porttitor metus et consequat. Integer...
<div class="read_box"><a href="#" _fcksavedurl="#" class="r">Devamı</a></div>
</div>
</div><img src="https://img.webme.com/pic/c/csstemplateworld2/pix.gif" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/pix.gif" width="10" alt="" style="float:left"/>
<div class="box box2">
<h1>Başlık2</h1>
<div class="text"><img src="https://img.webme.com/pic/c/csstemplateworld2/img2.jpg" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/img2.jpg" width="90" height="60" class="img_box" alt="" /><span class="f">Vivamus non congue dui. </span><br />
Sed porta dapibus tincidunt. Integer purus enim, aliquam ac sollicitudin ac, tempus nec justo. Maecenas lobortis, ante quis hendrerit porta, est nunc mollis sem, id dapibus quam diam et enim.
<div class="read_box"><a href="#" _fcksavedurl="#" class="f">Devamı</a></div>
</div>
</div><img src="https://img.webme.com/pic/c/csstemplateworld2/pix.gif" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/pix.gif" width="10" alt="" style="float:left" />
<div class="box box3">
<h1>Başlık3</h1>
<div class="text"><img src="https://img.webme.com/pic/c/csstemplateworld2/img3.jpg" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/img3.jpg" width="90" height="60" class="img_box" alt="" /><span class="o">Donec ligula mi, euismod vel molestie id, suscipit tempor nisi. </span>
Duis consectetur neque nec quam posuere non vehicula felis tincidunt. Sed in erat et leo convallis rhoncus. Ves- tibulum porta porttitor metus et consequat. Integer...
<div class="read_box"><a href="#" _fcksavedurl="#" class="o">Devamı</a></div>
</div>
</div>
</div>

Tasarım Altına

<-Bu Kodu Tasarım Altına Koy->      <div id="top_tb"></div>
<div id="tb">
<div id="right">
<h1>Css Tasarımları Hakkında</h1>
<div class="right_b"><span>Vivamus augue nibh, malesuada in interdum et, viverra hendrerit dui. </span><br />
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis...<br />
<div class="read"><img src="https://img.webme.com/pic/c/csstemplateworld2/fish_read.gif" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/fish_read.gif" alt="" width="5" height="5" class="fish_read" /><a href="#" _fcksavedurl="#"> read more</a></div><br />
</div>
<div class="right_b"><span>Vivamus augue nibh, malesuada in interdum et, viverra hendrerit dui. </span><br />
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis...<br />
<div class="read"><img src="https://img.webme.com/pic/c/csstemplateworld2/fish_read.gif" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/fish_read.gif" alt="" width="5" height="5" class="fish_read" /><a href="#" _fcksavedurl="#"> read more</a></div><br />
</div>
<div class="right_b"><span>Vivamus augue nibh, malesuada in interdum et, viverra hendrerit dui. </span><br />
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis...<br />
<div class="read"><img src="https://img.webme.com/pic/c/csstemplateworld2/fish_read.gif" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/fish_read.gif" alt="" width="5" height="5" class="fish_read" /><a href="#" _fcksavedurl="#"> read more</a></div><br />
</div>
</div>
<div id="left">Sitename
</div>
<div style="clear: both"><img src="https://img.webme.com/pic/c/csstemplateworld2/spaser.gif" _fcksavedurl="https://img.webme.com/pic/c/csstemplateworld2/spaser.gif" alt="" width="1" height="1" /></div>
</div>
<div id="bot_tb"></div>


<div id="footer">
Copyright  2010. Designed by <a href="http://www.csstemplateworld/" _fcksavedurl="http://www.csstemplateworld/" title="tasarımcı">SeLçuk</a><br />
<a href="#" _fcksavedurl="#">Css Template World</a> | <a href="#" _fcksavedurl="#">Link Adı</a> | <a href="http://validator.w3.org/check/referer" _fcksavedurl="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional"><FCK:abbr title="eXtensible HyperText Markup Language">XHTML</FCK:abbr></a> | <a href="http://jigsaw.w3.org/css-validator/check/referer" _fcksavedurl="http://jigsaw.w3.org/css-validator/check/referer" title="This page validates as CSS"><FCK:abbr title="Cascading Style Sheets">CSS</FCK:abbr></a></div>

</div>

Css Koduna

<-Bu Kodu Css Koduna Koy->/*Tema Tasarım ve Kodlama : csstemplateworld.tr.gg / SeLçuk */
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;}
*
/*
Design by Metamorphosis Design
http://www.metamorphozis.com
Released for free under a Creative Commons Attribution 2.5 License
*/
*
{
border: 0;
margin: 0;
}
img
{
border: 0px;
}
a{
text-decoration: none;
}
a:hover{
text-decoration: underline;
}
body{
font: 12px Arial, Helvetica, sans-serif;
color: #000000;
background: url(https://img.webme.com/pic/c/csstemplateworld2/bg.jpg) top center no-repeat #000000;
line-height: 20px;
}
#main {
width: 982px;
margin: 0px auto;
}
#header {
width:982px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/header.jpg) left top no-repeat;
height: 267px;
}
#logo {	font-family: Arial, Helvetica, sans-serif;
color:#FFFFFF;
font-size:18px;
font-style:italic;
padding: 48px 0px 0px 13px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/big_img.jpg) left top no-repeat;
height: 60px;
}
#logo a {
text-decoration: none;
text-transform: lowercase;
font-style: italic;
font-size: 18px;
color: #FFFFFF;
}
#logo H2 a{
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
text-transform: none;
font-weight:100;
}
#buttons{
width: 982px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/bg_but.jpg) left top no-repeat;
text-align:center;
padding-top: 10px;
height: 45px;
}
#buttons a {
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
display: block;
float: left;
height: 33px;
text-decoration: none;
color: #FFFFFF;
padding-top: 12px;
padding-left: 0px;
text-align: center;
width: 194px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/but.png) left top no-repeat;
}
#buttons a:hover {
background:url(https://img.webme.com/pic/c/csstemplateworld2/but_ov.png) left top no-repeat;
text-decoration: underline;
}
.but_p {width: 3px;
float:left;}
#box_all {
height: 210px;}
#box_all h1 {
text-align:center;
font-size:18px;
color:#FFFFFF;
font-weight:100;
padding: 8px 0px 17px 0px;}
#box_all .text {
padding: 0px 15px 0px 20px;}
.box {
width: 320px;
height: 201px;
float: left;
}
.box1 { background:url(https://img.webme.com/pic/c/csstemplateworld2/box1.gif) ;}
.box2 { background:url(https://img.webme.com/pic/c/csstemplateworld2/box2.gif) ;}
.box3 { background:url(https://img.webme.com/pic/c/csstemplateworld2/box3.gif) ;}
.read_box {
text-align:right;
padding-right:10px;
padding-top: 4px;
font-weight:bold;}
.r { color: #8D0711;}
.f { color: #8B0E47;}
.o { color: #CD3800;}
.img_box {	float:left;
margin: 6px 10px 3px 0px;
}
#top_tb {
width: 982px;
height: 10px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/tb_top.gif) center top no-repeat;
}
#bot_tb {
width: 982px;
height: 10px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/tb_bot.gif) center bottom no-repeat;
}
#tb{
width: 982px;
padding: 0px 0px 0px 0px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/tb.gif)  center repeat-y;
margin: 0px 0px 0px 0px;
}
#left{
width: 622px;
margin: 0px 0px 0px 13px;
float: left;
color:#000000;
}
.right_b {	background: url(https://img.webme.com/pic/c/csstemplateworld2/fish_right.gif)  0px 6px no-repeat;
padding-left: 28px;
padding-right: 5px;
}
.text{
padding: 0px 0px 0px 0px;
}
.img {	float:left;
margin: 7px 16px 3px 0px;
}
.img_r {	float: right;
margin: 7px 0px 3px 16px;
}
span {font-weight:bold;}
#left span {	color:#8D0711;
font-weight:bold;
}
#right span {	color:#8D0711;
font-weight:bold;
}
#left H1{
font-family: Arial, Helvetica, sans-serif;
font-size:18px;
font-weight: 100;
color: #D25B2E;
text-align:left;
padding: 5px 0px 10px 0px;
}
#right H1{
font-family: Arial, Helvetica, sans-serif;
font-size:18px;
font-weight: 100;
color: #D25B2E;
text-align:left;
padding: 5px 0px 10px 0px;
}
.read{
text-align:right;
padding-right:10px;
padding-top: 5px;
font-weight:bold;
text-decoration:none;
}
.fish_read {
margin: 0px 2px 1px 0px;
}
.read a{
color: #8D0711;}
#right{
float: right;
width: 294px;
margin-right: 16px;
padding: 0px 0px 0px 0px;
}
#footer{
height: 62px;
width: 100%;
font-size: 12px;
color: #FFFFFF;
text-align: center;
clear:both;
padding: 20px 0px 0px 0px;
background: url(https://img.webme.com/pic/c/csstemplateworld2/foter.gif) 0px 10px  no-repeat;
}
#footer a{
color: #FFFFFF;
font-size: 12px;
text-decoration: none;
}
#footer a:hover{
color: #FFFFFF;
font-size: 12px;
text-decoration: underline;
}