Tasarımın Üzerineki Yazı
Tasarımın Altındaki Yazı
CSS Kod
- Kod:
<div id="wrapper">
<div id="container1">
<div id="menu">
<div id="pettabs" class="indentmenu">
<ul>
<li><a href="[url=http://www.free-css.com/free-css-templates.php]http://www.free-css.com/free-css-templates.php[/url]" rel="tab1" class="selected">Giriş</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php]http://www.free-css.com/free-css-templates.php[/url]" rel="tab2">Dinle</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php]http://www.free-css.com/free-css-templates.php[/url]" rel="tab3">Yayın Akışı</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php]http://www.free-css.com/free-css-templates.php[/url]" rel="tab4">Dj Ler</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php]http://www.free-css.com/free-css-templates.php[/url]" rel="tab5">İstek Hattı</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php]http://www.free-css.com/free-css-templates.php[/url]" rel="tab6" style="border-right: none;">İletişim</a></li>
</ul>
</div>
<div class="tabcontentstyle">
<div id="tab1" class="tabcontent"></div>
<div id="tab2" class="tabcontent">
<ul>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Service]http://www.free-css.com/free-css-templates.php">Service[/url] 1</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Service]http://www.free-css.com/free-css-templates.php">Service[/url] 2</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Service]http://www.free-css.com/free-css-templates.php">Service[/url] 3</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Service]http://www.free-css.com/free-css-templates.php">Service[/url] 4</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Service]http://www.free-css.com/free-css-templates.php">Service[/url] 5</a></li>
</ul>
</div>
<div id="tab3" class="tabcontent">
<ul>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Product]http://www.free-css.com/free-css-templates.php">Product[/url] 1</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Product]http://www.free-css.com/free-css-templates.php">Product[/url] 2</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Product]http://www.free-css.com/free-css-templates.php">Product[/url] 3</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Product]http://www.free-css.com/free-css-templates.php">Product[/url] 4</a></li>
</ul>
</div>
<div id="tab4" class="tabcontent">
<ul>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Link]http://www.free-css.com/free-css-templates.php">Link[/url] 1</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Link]http://www.free-css.com/free-css-templates.php">Link[/url] 2</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Link]http://www.free-css.com/free-css-templates.php">Link[/url] 3</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Link]http://www.free-css.com/free-css-templates.php">Link[/url] 4</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Link]http://www.free-css.com/free-css-templates.php">Link[/url] 5</a></li>
<li><a href="[url=http://www.free-css.com/free-css-templates.php"Link]http://www.free-css.com/free-css-templates.php">Link[/url] 6</a></li>
</ul>
</div>
<div id="tab5" class="tabcontent"> Something you might want to know about us. </div>
<div id="tab6" class="tabcontent"> Don't be hesitated to contact us if you have something to say. </div>
</div>
</div>
<!-- end of mneu -->
<div id="banner">
<h1>Yeni tasarıma hoşgeldiniz !</h1>
<p>bu tasarım <a href="[url=http://bedavasitem.forum.st/profile.forum?mode=viewprofile&u=1020"font]http://bedavasitem.forum.st/profile.forum?mode=viewprofile&u=1020"><font[/url] color="white">Relaxis</font></a> tarafından tr.gg ye optimize edilmiştir .</p>
</div>
<div id="content1">
<div id="content_top"></div>
<div class="content_section_01">
<div class="section_01_left">
Tasarımın Altındaki Yazı
- Kod:
</div>
<div class="section_01_right">
<h1>Site Haberleri</h1>
<h3>Siteniz hayırlı olsun.</h3>
<p>Donec enim enim, imperdiet quis, mollis a, elementum a, diam. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<a href="[url=http://bedavasitem.forum.st"Devamını]http://bedavasitem.forum.st">Devamını[/url] oku</a> </div>
<div class="cleaner"> </div>
</div>
<div class="content_section_02">
<div class="section_02_subsection">
<h2>Featured Services</h2>
<p>Suspen disse a nibh tristique justo rhoncus volutpat.</p>
<ul>
<li><a href="[url=http://bedavasitem.forum.st"Free]http://bedavasitem.forum.st">Free[/url] Flash Templates</a></li>
<li><a href="[url=http://bedavasitem.forum.st"CSS]http://bedavasitem.forum.st">CSS[/url] Web Templates</a></li>
<li><a href="[url=http://bedavasitem.forum.st"Web]http://bedavasitem.forum.st">Web[/url] Design Blog</a></li>
<li><a href="[url=http://bedavasitem.forum.st"Premium]http://bedavasitem.forum.st">Premium[/url] Templates</a></li>
</ul>
<a href="[url=http://bedavasitem.forum.st"devamını]http://bedavasitem.forum.st">devamını[/url] oku...</a> </div>
<div class="section_02_subsection">
<h2>Why choose us?</h2>
<p>Pellentesque lectus justo, fermentum in, ornare vitae, vehicula eu, felis.</p>
<ul>
<li>Quisque facilisis suscipit elit</li>
<li>Lacus et dictum tristique</li>
<li>Eeros ac tincidunt aliquam</li>
<li>Nullam commodo arcu non facilisis</li>
</ul>
<a href="[url=http://bedavasitem.forum.st"devamını]http://bedavasitem.forum.st">devamını[/url] oku...</a> </div>
<div class="section_02_subsection" style="border-right: none;">
<h2>Testimonials</h2>
<h3>Phasellus id purus</h3>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Quisque at nulla eu elit adipiscing tempor.</p>
<a href="[url=http://www.free-css.com/free-css-templates.php"Flash]http://www.free-css.com/free-css-templates.php">Flash[/url] Templates</a>
<div style="clear: both; margin-top: 30px;"> <a target="_blank" rel="nofollow" href="[url=http://validator.w3.org/check?uri=referer"img]http://validator.w3.org/check?uri=referer"><img[/url] style="border:0;width:88px;height:31px" src="[url=http://www.w3.org/Icons/valid-xhtml10]http://www.w3.org/Icons/valid-xhtml10[/url]" alt="website template image" width="88" height="31" vspace="8" border="0" /></a> <a target="_blank" rel="nofollow" href="[url=http://jigsaw.w3.org/css-validator/check/referer"img]http://jigsaw.w3.org/css-validator/check/referer"><img[/url] style="border:0;width:88px;height:31px" src="[url=http://jigsaw.w3.org/css-validator/images/vcss-blue]http://jigsaw.w3.org/css-validator/images/vcss-blue[/url]" alt="website template image" vspace="8" border="0" /></a> </div>
</div>
<div class="cleaner"> </div>
</div>
</div>
<div id="footer">
<p><a href="[url=http://bedavasitem.forum.st"Giriş/a]http://bedavasitem.forum.st">Giriş</a[/url]> | <a href="[url=http://bedavasitem.forum.st"Products/a]http://bedavasitem.forum.st">Products</a[/url]> | <a href="[url=http://bedavasitem.forum.st"Services/a]http://bedavasitem.forum.st">Services</a[/url]> | <a href="[url=http://bedavasitem.forum.st"S.S.S/a]http://bedavasitem.forum.st">S.S.S</a[/url]> |<a href="[url=http://bedavasitem.forum.st"İletişim/a]http://bedavasitem.forum.st">İletişim</a[/url]> </p>
<p>Copyright 2oo9 <a href="/Ana-Sayfa.htm"><strong>Sitenin Adı</strong></a> | <a href="[url=http://bedavasitem.forum.st"Tüm]http://bedavasitem.forum.st">Tüm[/url] hakları saklıdır !</a> </p>
</div>
<!-- end of footer -->
</div>
</div>
CSS Kod
- Kod:
table {margin-left: auto;margin-right: auto}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;}
/*
CSS Credit: [url=http://www.templatemo.com]http://www.templatemo.com[/url]
*/
body {
margin: 0;
padding: 0;
line-height: 1.5em;
font-family: Verdana, Arial, san-serif;
font-size: 12px;
color: #e7eaeb;
background: #6d6a6b url([url=http://img.webme.com/pic/d/denemesitemx/bg.jpg]http://img.webme.com/pic/d/denemesitemx/bg.jpg[/url]) repeat;
}
a:link, a:visited { color: #00a1ff; text-decoration: none; font-weight: bold; }
a:active, a:hover { color: #00a1ff; text-decoration: underline; }
p {
margin: 0px;
padding: 0px;
}
img {
margin: 0px;
padding: 0px;
border: none;
}
.cleaner {
clear: both;
width: 100%;
height: 1px;
font-size: 1px;
}
.cleaner_with_height {
clear: both;
width: 100%;
height: 30px;
font-size: 1px;
}
.cleaner_with_width {
float: left;
width: 20px;
height: 30px;
font-size: 1px;
}
#wrapper {
margin: 0 auto;
background: url([url=http://img.webme.com/pic/d/denemesitemx/gradient_bg.jpg]http://img.webme.com/pic/d/denemesitemx/gradient_bg.jpg[/url]) top repeat-x;
}
#container1 {
width: 960px;
margin: 0 auto;
padding: 0 10px 10px 10px;
}
/* banner */
#banner {
clear: both;
width: 880px;
height: 250px;
padding: 0 40px;
margin: 0 0 5px 0;
background: url([url=http://img.webme.com/pic/d/denemesitemx/banner_bg.jpg]http://img.webme.com/pic/d/denemesitemx/banner_bg.jpg[/url]) no-repeat;
}
#banner h1 {
margin: 0px;
padding: 0px;
padding: 80px 0 20px 0;
font-size: 50px;
font-weight: bold;
color: #fff;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
#banner p {
font-size: 30px;
width: 400px;
line-height: 30px;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
}
/* end of banner */
#content1 {
clear: both;
position: relative;
width: 956px;
padding: 0 2px;
background: url([url=http://img.webme.com/pic/d/denemesitemx/content_middle.jpg]http://img.webme.com/pic/d/denemesitemx/content_middle.jpg[/url]) repeat-y;
}
#content1 #content_top {
position: absolute;
width: 960px;
height: 10px;
top: 0;
left: 0;
background: url([url=http://img.webme.com/pic/d/denemesitemx/content_top.jpg]http://img.webme.com/pic/d/denemesitemx/content_top.jpg[/url]) no-repeat;
}
#content1 h1 {
font-size: 24px;
color: #009dff;
padding: 0 0 20px 0;
margin: 0 0 10px 0;
font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}
#content h2 {
font-size: 20px;
color: #009dff;
padding: 0 0 10px 0;
margin: 0 0 10px 0;
font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}
#content1 h3 {
font-size: 16px;
color: #c6ca1d;
padding: 0 0 5px 30px;
margin: 0 0 5px 0;
font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
background: url([url=http://img.webme.com/pic/d/denemesitemx/list_icon.jpg]http://img.webme.com/pic/d/denemesitemx/list_icon.jpg[/url]) top left no-repeat;
}
#content img {
float: left;
border: 3px solid #221e1f;
margin: 3px 30px 5px 0;
}
#content1 .content_section_01 {
clear: both;
width: 876px;
padding: 40px;
background-color: #444041;
}
.content_section_01 .section_01_left {
float: left;
width: 556px;
padding-right: 40px;
border-right: 1px solid #333;
}
.content_section_01 .section_01_right {
float: right;
width: 238px;
}
.section_01_left p{
padding-bottom: 10px;
text-align: justify;
}
.section_01_right p{
padding-bottom: 5px;
text-align: justify;
}
#content1 .content_section_02 {
clear: both;
color: #CCC;
width: 956px;
padding: 0px;
border-top: 1px solid #2c2829;
background-color: #221e1f;
}
.content_section_02 p {
text-align: left;
}
.content_section_02 .section_02_subsection {
float: left;
width: 238px;
margin: 30px 0px;
padding: 0 40px;
border-right: 1px solid #332e30;
background-color: #221e1f;
}
.section_02_subsection li a {
color: #e7eaeb;
font-weight: normal;
}
.section_02_subsection ul {
margin: 20px 0 10px 10px;
padding: 0px;
list-style: none;
}
.section_02_subsection li {
margin: 0px;
padding: 0 0 15px 25px;
background: url([url=http://img.webme.com/pic/d/denemesitemx/list_icon_02.jpg]http://img.webme.com/pic/d/denemesitemx/list_icon_02.jpg[/url]) top left no-repeat;
}
/* footer */
#footer {
clear: both;
width: 960px;
height: 65px;
padding: 15px 0 0 0;
text-align: center;
color: #888;
background: url([url=http://img.webme.com/pic/d/denemesitemx/footer.jpg]http://img.webme.com/pic/d/denemesitemx/footer.jpg[/url]);
}
#footer p {
padding-bottom: 5px;
}
#footer a {
color: #888;
font-weight: normal;
}
/* end of footer */
#menu {
clear: both;
width: 958px;
height: 125px;
padding: 0 1px;
background: url([url=http://img.webme.com/pic/d/denemesitemx/top_panel_bg.jpg]http://img.webme.com/pic/d/denemesitemx/top_panel_bg.jpg[/url]) no-repeat;
}
.indentmenu{
font: bold 14px Arial;
height: 58px;
width: 958px; /*leave this value as is in most cases*/
}
.indentmenu ul{
margin: 0;
padding: 0;
height: 58px;
background: black url([url=http://img.webme.com/pic/d/denemesitemx/indentbg.gif]http://img.webme.com/pic/d/denemesitemx/indentbg.gif[/url]) center center repeat-x;
}
.indentmenu ul li{
display: inline;
}
.indentmenu ul li a{
float: left;
color: white; /*text color*/
width: 158px;
text-align: center;
height: 40px;
padding-top: 18px;
text-decoration: none;
border-right: 2px solid #000; /*navy divider between menu items*/
background: url([url=http://img.webme.com/pic/d/denemesitemx/menu_bg.jpg]http://img.webme.com/pic/d/denemesitemx/menu_bg.jpg[/url]) repeat-x;
outline: none;
}
.indentmenu ul li a:visited{
color: white;
}
.indentmenu ul li a.selected, .indentmenu ul li a:hover{
color: white !important;
background: black url([url=http://img.webme.com/pic/d/denemesitemx/menu_hover_bg.jpg]http://img.webme.com/pic/d/denemesitemx/menu_hover_bg.jpg[/url]) center center;
}
.indentmenu li .last{
border-right: none;
}
.tabcontentstyle{ /*style of tab content oontainer*/
clear: both;
width:900px; height: 35px; padding: 23px 30px 0 30px;
color: #fff;
font-size: 14px;
}
.tabcontentstyle ul{
margin: 0px;
padding: 0px;
list-style: none;
}
.tabcontentstyle li{
margin: 0px;
padding: 0px;
display: inline;
}
.tabcontentstyle li a {
font-weight: normal;
color: #FFF;
margin: 0px;
padding: 0 10px 0 5px;
}
.tabcontent{
display:none;
}
@media print {
.tabcontent {
display:block !important;
}
}