...::Herşey Burada::... - CSS Tasarımlar 2

CSS Tasarımlar 2

Tasarımları Daha Geniş Görmek isterseniz Resimi tıklayın

Tasarım 1

Tasarım Üstü

Tasarim Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background: url(http://img37.imageshack.us/img37/5100/ase.png) top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background:  none; width: 1007px; height: 143px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas1_01.gif); width: 1007px; height: 248px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas1_02.gif); width: 1007px; height: 327%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 20px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas1_03.gif); width: 1007px; height: 193px; float: left; } #kommentartext { background-image: none; }

------------------------------------------------------------------------------------------------------------

Tasarım 2

Tasarım Üstü

Tasarim Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background: url(http://img37.imageshack.us/img37/5100/ase.png) top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background:  none; width: 1007px; height: 143px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas2_01.gif); width: 1007px; height: 248px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas2_02.gif); width: 1007px; height: 327%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 20px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas2_03.gif); width: 1007px; height: 193px; float: left; } #kommentartext { background-image: none; }

---------------------------------------------------------------------------------------------------------------

Tasarım 3

Tasarım Üstü

Tasarim Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background: url(http://img37.imageshack.us/img37/5100/ase.png) top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background:  none; width: 1007px; height: 143px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas3_01.gif); width: 1007px; height: 248px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas3_02.gif); width: 1007px; height: 327%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 20px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas3_03.gif); width: 1007px; height: 193px; float: left; } #kommentartext { background-image: none; }

--------------------------------------------------------------------------------------------------------

Tasarım 4

Tasarım Üstü

Tasarim Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background:  none top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background:  none; width: 1007px; height: 143px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas4_01.gif); width: 1007px; height: 256px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas4_02.gif); width: 1007px; height: 331%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 18px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas4_03.gif); width: 1007px; height: 181px; float: left; } #kommentartext { background-image: none; }

------------------------------------------------------------------------------------------------------------------------

Tasarım 5

Tasarım Üstü

Tasarım Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background:  none top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background:  none; width: 1007px; height: 143px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas5_01.gif); width: 1007px; height: 230px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas5_02.gif); width: 1007px; height: 342%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 800px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 19px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas5_03.gif); width: 1007px; height: 196px; float: left; } #kommentartext { background-image: none; }

-----------------------------------------------------------------------------------------------------------------------

Tasarım 6

Tasarım Üstü

Tasarım Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background:  none top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background:  none; width: 1007px; height: 143px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas6_01.gif); width: 1007px; height: 215px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas6_02.gif); width: 1007px; height: 393%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 15px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas6_03.gif); width: 1007px; height: 160px; float: left; } #kommentartext { background-image: none; }

------------------------------------------------------------------------------------------------------------------

Tasarım 7

Tasarım Üstü

Tasarım Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background:  none top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas7ust.gif); width: 1007px; height: 350px; float: left; text-align: center; padding: 0px 0 0 0; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas7_01.gif); width: 1007px; height: 51px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas7_02.gif); width: 1007px; height: 663%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 41px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tasarimnetr/tas7_03.gif); width: 1007px; height: 54px; float: left; } #kommentartext { background-image: none; }

-------------------------------------------------------------------------------------------------------------------

Tasarım 8

Tasarım Üstü

Tasarim Altı

CSS Kodu

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;} * {padding: 0; margin:0 } body { margin-left: auto; margin-right: auto; background:  none top center fixed; } #tasarim{ width: 1000px; margin-left: auto; margin-right: auto; } #baslik{ margin-left: auto; margin-right: auto; background:  none; width: 1007px; height: 0px; float: left; text-align: center; padding: 0px 0 0 237px; font-size: 15px; color: #000000; font-family: Verdana; } #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tolgahantr/rap_01.gif); width: 1007px; height: 343px; float: left; } #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tolgahantr/rap_02.gif); width: 1007px; height: 213%; float: left; } .solsutun{ width:175px; float: left; padding: 0 0 0 20px; overflow: hidden; } .sagsutun { width:675px; float: left; padding: 0 0 0 237px; overflow: hidden; text-align: justify; } #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/t/tolgahantr/rap_03.gif); width: 1007px; height: 212px; float: left; } #kommentartext { background-image: none; }

Tasarım Üzerine Ekle

Tasarım Altına Ekle

Css Style Kodalrına Ekle

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;}
* {padding: 0; margin:0 }
body {
margin-left: 0 auto;
margin-right:0 auto;
background: url(http://img462.imageshack.us/img462/9500/christmas22dk1.gif) top center fixed;
}
#tasarim{
width: 1000px;
margin-left: 0 auto;
margin-right:0 auto;
}
#baslik{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/h/hackerfriend4/header.png);
width: 1000px;
height: 0px;
float: left;
text-align: center;
padding: 0px 0 0 0;
font-size: 20px;
color: #ff0000;
font-family: Verdana, arial;
}
#ust{
margin-left: 0 auto;
margin-bottom: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/f/flashmix/o1.png);
width: 1000px;
height: 191px;
float: left;
}
#orta{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/f/flashmix/o2.png);
width: 1000px;
height: 100%;
float: left;
}
.solsutun{
width:155px;
float: left;
padding: 0 0 0 36px;
overflow: hidden;
}
.sagsutun {
width:765px;
float: left;
padding: 0 0 0 35px;
overflow: hidden;
text-align: justify;
}
#alt{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/f/flashmix/o3.png);
width: 1000px;
height: 191px;
float: left;
}
<div id="alt">aaaaa</div>
body {
background: #;
color: #666;
}
h1 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
margin:0;
padding:0;
}
hr {
border:none;
border-top:1px solid #CCCCCC;
height:1px;
margin-bottom:5px;
}
a {
color: #900;
text-decoration: none;
}
/* Root = Vertical, Secondary = Vertical */
ul#navmenu,
ul#navmenu li,
ul#navmenu ul {
margin: 0;
border: 0 none;
padding: 0;
width: 160px; /*For KHTML*/
list-style: none;
}
ul#navmenu:after /*From IE 7 lack of compliance*/{
clear: both;
display: block;
font: 2px/0px serif;
content: ".";
height: 0;
visibility: hidden;
}
ul#navmenu li {
float: left; /*For IE 7 lack of compliance*/
display: block !important; /*For GOOD browsers*/
display: inline; /*For IE*/
position: relative;
}
/* Root Menu */
ul#navmenu a {
border: 1px solid #CCC;
border-right-color: #CCC;
border-bottom-color: #CCC;
padding: 0 6px;
display: block;
background: #EEE;
color: #666;
font: bold 11px/22px Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
height: auto !important;
height: 1%; /*For IE*/
}
/* Root Menu Hover Persistence */
ul#navmenu a:hover,
ul#navmenu li:hover a,
ul#navmenu li.iehover a {
background: #CCC;
color: #;
}
/* 2nd Menu */
ul#navmenu li:hover li a,
ul#navmenu li.iehover li a {
background: #EEE;
color: #666;
}
/* 2nd Menu Hover Persistence */
ul#navmenu li:hover li a:hover,
ul#navmenu li:hover li:hover a,
ul#navmenu li.iehover li a:hover,
ul#navmenu li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 3rd Menu */
ul#navmenu li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 3rd Menu Hover Persistence */
ul#navmenu li:hover li:hover li a:hover,
ul#navmenu li:hover li:hover li:hover a,
ul#navmenu li.iehover li.iehover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 4th Menu */
ul#navmenu li:hover li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 4th Menu Hover */
ul#navmenu li:hover li:hover li:hover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover li a:hover {
background: #CCC;
color: #FFF;
}
ul#navmenu ul,
ul#navmenu ul ul,
ul#navmenu ul ul ul {
display: none;
position: absolute;
top: 0;
left: 150px;
}
/* Do Not Move - Must Come Before display:block for Gecko */
ul#navmenu li:hover ul ul,
ul#navmenu li:hover ul ul ul,
ul#navmenu li.iehover ul ul,
ul#navmenu li.iehover ul ul ul {
display: none;
}
ul#navmenu li:hover ul,
ul#navmenu ul li:hover ul,
ul#navmenu ul ul li:hover ul,
ul#navmenu li.iehover ul,
ul#navmenu ul li.iehover ul,
ul#navmenu ul ul li.iehover ul {
display: block;
}

Tasarım Üstüne Kod

Tasarım Altına Kod

Css Style Kodları

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;}
* {padding: 0; margin:0 }
body {
margin-left: 0 auto;
margin-right:0 auto;
background: url(http://img191.imageshack.us/img191/2301/greenorganic66na8.jpg) top center fixed;
}
#tasarim{
width: 1000px;
margin-left: 0 auto;
margin-right:0 auto;
}
#baslik{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/h/hackerfriend4/header.png);
width: 1000px;
height: 0px;
float: left;
text-align: center;
padding: 0px 0 0 0;
font-size: 20px;
color: #ff0000;
font-family: Verdana, arial;
}
#ust{
margin-left: 0 auto;
margin-bottom: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/p/pitoyun/r1.png);
width: 1000px;
height: 191px;
float: left;
}
#orta{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/p/pitoyun/r2.png);
width: 1000px;
height: 100%;
float: left;
}
.solsutun{
width:175px;
float: left;
padding: 0 0 0 55px;
overflow: hidden;
}
.sagsutun {
width:710px;
float: left;
padding: 0 0 0 30px;
overflow: hidden;
text-align: justify;
}
#alt{
margin-left: 0 auto;
margin-right:0 auto;
background: url(https://img.webme.com/pic/p/pitoyun/r3.png);
width: 1000px;
height: 191px;
float: left;
}
<div id="alt">aaaaa</div>
body {
background: #;
color: #666;
}
h1 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
margin:0;
padding:0;
}
hr {
border:none;
border-top:1px solid #CCCCCC;
height:1px;
margin-bottom:5px;
}
a {
color: #900;
text-decoration: none;
}
/* Root = Vertical, Secondary = Vertical */
ul#navmenu,
ul#navmenu li,
ul#navmenu ul {
margin: 0;
border: 0 none;
padding: 0;
width: 170px; /*For KHTML*/
list-style: none;
}
ul#navmenu:after /*From IE 7 lack of compliance*/{
clear: both;
display: block;
font: 2px/0px serif;
content: ".";
height: 0;
visibility: hidden;
}
ul#navmenu li {
float: left; /*For IE 7 lack of compliance*/
display: block !important; /*For GOOD browsers*/
display: inline; /*For IE*/
position: relative;
}
/* Root Menu */
ul#navmenu a {
border: 1px solid #CCC;
border-right-color: #CCC;
border-bottom-color: #CCC;
padding: 0 6px;
display: block;
background: #EEE;
color: #666;
font: bold 11px/22px Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
height: auto !important;
height: 1%; /*For IE*/
}
/* Root Menu Hover Persistence */
ul#navmenu a:hover,
ul#navmenu li:hover a,
ul#navmenu li.iehover a {
background: #CCC;
color: #;
}
/* 2nd Menu */
ul#navmenu li:hover li a,
ul#navmenu li.iehover li a {
background: #EEE;
color: #666;
}
/* 2nd Menu Hover Persistence */
ul#navmenu li:hover li a:hover,
ul#navmenu li:hover li:hover a,
ul#navmenu li.iehover li a:hover,
ul#navmenu li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 3rd Menu */
ul#navmenu li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 3rd Menu Hover Persistence */
ul#navmenu li:hover li:hover li a:hover,
ul#navmenu li:hover li:hover li:hover a,
ul#navmenu li.iehover li.iehover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover a {
background: #CCC;
color: #FFF;
}
/* 4th Menu */
ul#navmenu li:hover li:hover li:hover li a,
ul#navmenu li.iehover li.iehover li.iehover li a {
background: #EEE;
color: #666;
}
/* 4th Menu Hover */
ul#navmenu li:hover li:hover li:hover li a:hover,
ul#navmenu li.iehover li.iehover li.iehover li a:hover {
background: #CCC;
color: #FFF;
}
ul#navmenu ul,
ul#navmenu ul ul,
ul#navmenu ul ul ul {
display: none;
position: absolute;
top: 0;
left: 150px;
}
/* Do Not Move - Must Come Before display:block for Gecko */
ul#navmenu li:hover ul ul,
ul#navmenu li:hover ul ul ul,
ul#navmenu li.iehover ul ul,
ul#navmenu li.iehover ul ul ul {
display: none;
}
ul#navmenu li:hover ul,
ul#navmenu ul li:hover ul,
ul#navmenu ul ul li:hover ul,
ul#navmenu li.iehover ul,
ul#navmenu ul li.iehover ul,
ul#navmenu ul ul li.iehover ul {
display: block;
}

Tasarımın Üzerindeki Yazı

  <div id="wrap">  <div id="header"> <h1 id="logo-text"> osman <a href="index.html" _fcksavedurl="index.html" _fcksavedurl="index.html" _fcksavedurl="index.html"></a> <div id="header-links"> </div> </div> <style type="text/css"> /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ #ddcolortabs{ margin-left: 4px; padding: 0; width: 100%; background: transparent; voice-family: ""}""; voice-family: inherit; padding-left: 5px; } #ddcolortabs ul{ font: bold 11px Arial, Verdana, sans-serif; margin:0; padding:0; list-style:none; } #ddcolortabs li{ display:inline; margin:0 2px 0 0; padding:0; text-transform:uppercase; } #ddcolortabs a{ float:left; color: white; background: #666666 url(media/color_tabs_left.gif) no-repeat left top; margin:0 2px 0 0; padding:0 0 1px 3px; text-decoration:none; letter-spacing: 1px; } #ddcolortabs a span{ float:left; display:block; background: transparent url(media/color_tabs_right.gif) no-repeat right top; padding:4px 9px 2px 6px; } #ddcolortabs a span{ float:none; } #ddcolortabs a:hover{ background-color: #BFBFBF; } #ddcolortabs a:hover span{ background-color: #BFBFBF; } #ddcolortabs #current a, #ddcolortabs #current span{ /*currently selected tab*/ background-color: #BFBFBF; } #ddcolortabsline{ clear: both; padding: 0; width: 100%; height: 8px; line-height: 8px; background: #666666; border-top: 1px solid #fff; /*Remove this to remove border between bar and tabs*/ } </style> <div id="ddcolortabs"> <ul> <li style="margin-left: 1px"><a href="http://www.dynamicdrive.com" _fcksavedurl="http://www.dynamicdrive.com" title="Home"><span>Home</span></a></li> <li><a href="http://www.dynamicdrive.com/new.htm" _fcksavedurl="http://www.dynamicdrive.com/new.htm" title="New"><span>New</span></a></li> <li id="current"><a href="http://www.dynamicdrive.com/revised.htm" _fcksavedurl="http://www.dynamicdrive.com/revised.htm" title="Revised"><span>Revised</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://tools.dynamicdrive.com" _fcksavedurl="http://tools.dynamicdrive.com" title="Tools"><span>Tools</span></a></li> <li><a href="http://www.dynamicdrive.com/forums/" _fcksavedurl="http://www.dynamicdrive.com/forums/" title="DHTML Forums"><span>Forums</span></a></li> </ul> </div> <div id="ddcolortabsline"> </div> <p class="info">Yazı</p> <style type="text/css"> .info { background: #BFBFBF url(http://xyberneticos.com/demos/Mensajes_css/images/info.gif) center no-repeat; background-position: 15px 50%; /* x-pos y-pos */ text-align: left; padding: 8px 25px 8px 50px; border-top: 2px solid #000000; border-bottom: 2px solid #000000; color:#000000; } </style>  <div id="menu"> <div align="center"> <tr> <td> <ul> </table> </div></div>  <div id="content-wrap"> <div id="sidebar"><div class="left-box"> <p class="align-right"> </p> </div> </div> 

Tasarımın Altındaki Yazı
  </div>  <div id="footer"> </div>  </div><br> 

Css Kodu
 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;} table iframe { margin-left: 150px } lli.nav_element{display: none;} li.nav_element a{display: none;} 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;} /* Top Elements */ * { margin: 0; padding: 0; outline: 0 } body { background-image:url(Arkplan);background-color:#ffffff; font: 70%/1.5em Verdana, Tahoma, arial, sans-serif; color: #555; text-align: center; } /* links */ a, a:visited { text-decoration: none; color: #2180BC; background: inherit; } a:hover { color: #88ac0b; background: inherit; text-decoration: underline; } /* headers */ h1, h2, h3 { font-family: 'Trebuchet MS', Tahoma, Sans-serif; } h1 { font-size: 150%; font-weight: normal; color: #cccccc; } h2 { font-size: 140%; text-transform: uppercase; color: #cccccc; } h3 { font-size: 120%; color: #cccccc; } h1, h2, h3, p { padding: 10px; margin: 0; } ul, ol { margin: 5px 20px; padding: 0 20px; } /******************************************** Design ********************************************/ #wrap { width: 920px; background: url(https://img.webme.com/pic/d/deneme688/ortaadneme23.png) repeat-y center top; margin: 0 auto; text-align: left; } #content-wrap { clear: both; width: 918px; padding: 0; margin: 10px auto; } #header { width: 920px; position: relative; height: 150px; background: #fff url(https://img.webme.com/pic/d/deneme688/baslikdnm33.png) no-repeat center top; padding: 0; } #header h1#logo-text a { position: absolute; margin: 0; padding: 0; font: bolder 24px 'Trebuchet MS', Arial, Sans-serif; letter-spacing: -2px; color: #FFF; text-transform: none; text-decoration: none; background: transparent; /* change the values of top and left to adjust the position of the logo*/ top: 25px; left: 27px; } background: url(https://img.webme.com/pic/d/deneme688/ortaadneme23.png) repeat-x 0 0; font: bold 12px/17px Verdana, Arial, Tahoma, Sans-serif; height: 18px; width: 920px; } #menu ul { float: right; list-style: none; margin:0; padding: 0; } #menu ul li { display: inline; } #menu ul li a { display: block; float: left; padding: 0 12px; color: #000000; text-decoration: none; } #menu ul li.last a { padding-right: 20px; } #main h2 { margin-top: 30px; font: Bold 140% 'Trebuchet MS', Tahoma, Sans-serif; color: #88ac0b; padding: 5px 0 5px 25px; border-bottom: 1px solid #EFF0F1; background: #FFF none no-repeat 3px 50%; text-transform: none; } #main h2 a { background: none; color: #88ac0b; text-decoration: none; } #main ul li { list-style-image: none; } .post-footer { background-color: #FAFAFA; padding: 5px; margin: 20px 10px 10px 10px; border: 1px solid #f2f2f2; font-size: 95%; } .post-footer .date { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .comments { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } .post-footer .readmore { background: none no-repeat left center; padding-left: 20px; margin: 0 10px 0 5px; } /* Sidebar */ #sidebar { float: right; width: 26.5%; padding: 0; margin: 0; color: #000; } #sidebar h3 { margin-top: 10px; padding: 20px 20px; font: bold 1.4em 'Trebuchet MS', Tahoma, Sans-serif; color: #bc0303; } #sidebar ul.sidemenu { list-style: none; text-align: left; margin: 7px 4px 8px 0; padding: 0; text-decoration: none; background: none repeat-x left top; } #sidebar ul.sidemenu li { list-style: none; background: none repeat-x left bottom; padding: 4px 0 4px 5px; margin: 0 20px; color: #bc0303; } * html body #sidebar ul.sidemenu li { height: 1%; } #sidebar ul.sidemenu li a { text-decoration: none; background-image: none; color: #666666; } #sidebar ul.sidemenu li a:hover { color: #1773BC; } #sidebar ul.sidemenu ul { margin: 0 0 0 5px; padding: 0; } #sidebar ul.sidemenu ul li { background: none; } /* Footer */ #footer { color: #C6DDEE; background: url(https://img.webme.com/pic/d/deneme688/asagiiiidne3.png) no-repeat center top; clear: both; width: 920px; height: 170px; text-align: center; font-size: 92%; } #footer a { color: #FFF; text-decoration: none; } /* alignment classes */ .float-left { float: left; } .float-right { float: right; } .align-left { text-align: left; } .align-right { text-align: right; } /* display and additional classes */ .clear { clear:

Tasarımın Üzerindeki Yazı

Tasarımın Altındaki Yazı

Css Kodu

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;}  * {padding: 0; margin:0 }  body { margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/b/bycity/dvrkagiti1.jpg) top center fixed; }  #tasarim{ width: 1000px; margin-left: 0 auto; margin-right:0 auto; }       #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/o/osmantalay/cityust5.png); width: 1000px; height: 191px; float: left; }  #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/o/osmantalay/bycityorta.png); width: 1000px; height: 100%; float: left; }  .solsutun{ width:167px; float: left; padding: 0 0 0 50px; overflow: hidden; }  .sagsutun { width:675px; float: left; padding: 0 0 0 50px; overflow: hidden; text-align: justify; }   #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/o/osmantalay/cityalt5.png); width: 1000px; height: 196px; float: left; }

Tasarım Üzerindeki Yazı

Tasarımın Altındaki Yazı

Css Kodu

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;}  * {padding: 0; margin:0 }  body { margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/d/deneme688/arkplanyni.jpg) top center fixed; }  #tasarim{ width: 1000px; margin-left: 0 auto; margin-right:0 auto; }       #ust{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/d/deneme688/ustbss.png); width: 1000px; height: 250px; float: left; }  #orta{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/d/deneme688/ortabss.png); width: 1000px; height: 100%; float: left; }  .sagsutun { width:205px; float: right; padding: 0 0 0 50px; overflow: hidden;}  .solsutun{ width:690px; float: left; padding: 0 0 0 50px; overflow: hidden;text-align: justify; }   #alt{ margin-left: 0 auto; margin-right:0 auto; background: url(https://img.webme.com/pic/d/deneme688/altbsss.png); width: 1000px; height: 250px; float: left; }

v5

Üst

<div id="tasarim"> <div id="ust">  <div class="logo">   </div> <div class="reklamalani">           <a href="http//www.mrossi.tr.gg" _fcksavedurl="http//www.mrossi.tr.gg" _fcksavedurl="http//www.mrossi.tr.gg" target="_self"><img border="0" src="https://img.webme.com/pic/m/mrossi/newbnner.gif" _fcksavedurl="https://img.webme.com/pic/m/mrossi/newbnner.gif" _fcksavedurl="https://img.webme.com/pic/m/mrossi/newbnner.gif" alt="" /></a>      </div>       <div class="ustmenuosman"> <strong>  Arkadaşlar Tasarımı İstediğiniz Gibi Kullanın Bu Bir Osman Talay (MrOssi) Tasarımıdır.   <strong> </div></div>  <div id="orta">  <div class="menuosman">  <style type="text/css">  .urbangreymenu{ width: 190px; /*width of menu*/ }  .urbangreymenu .headerbar{ font: bold 13px Verdana; color: white; background: #000000 url(media/arrowstop.gif) no-repeat 8px 6px; /*last 2 values are the x and y coordinates of bullet image*/ margin-bottom: 0; /*bottom spacing between header and rest of content*/ text-transform: uppercase; padding: 7px 0 7px 31px; /*31px is left indentation of header text*/ }  .urbangreymenu ul{ list-style-type: none; margin: 0; padding: 0; margin-bottom: 0; /*bottom spacing between each UL and rest of content*/ }  .urbangreymenu ul li{ padding-bottom: 2px; /*bottom spacing between menu items*/ }  .urbangreymenu ul li a{ font: normal 12px Arial; color: black; background: #E9E9E9; display: block; padding: 5px 0; line-height: 17px; padding-left: 8px; /*link text is indented 8px*/ text-decoration: none; }  .urbangreymenu ul li a:visited{ color: black; }  .urbangreymenu ul li a:hover{ /*hover state CSS*/ color: white; background: gray; }  </style>  <div class="urbangreymenu">  <h3 class="headerbar">Ana Menü</h3> <ul> <li><a href="http://mrossi.tr.gg/Ana-Sayfa.htm" _fcksavedurl="http://mrossi.tr.gg/Ana-Sayfa.htm">Ana Sayfa</a></li> <li><a href="http://mrossi.tr.gg/Z-.-Defteri.htm" _fcksavedurl="http://mrossi.tr.gg/Z-.-Defteri.htm">Z.Defteri</a></li> <li><a href="http://mrossi.tr.gg/Toplist.htm" _fcksavedurl="http://mrossi.tr.gg/Toplist.htm">Toplist</a></li> <li><a href="http://mrossi.tr.gg/iletisim.htm" _fcksavedurl="http://mrossi.tr.gg/iletisim.htm">İletişim</a></li> <li><a href="http://mrossi.tr.gg/Sohbet.htm" _fcksavedurl="http://mrossi.tr.gg/Sohbet.htm">Sohbet</a></li> <li><a href="http://mrossi.tr.gg/Destek-Ol.htm" _fcksavedurl="http://mrossi.tr.gg/Destek-Ol.htm">Destek Ol</a></li> <li><a href="http://mrossi.tr.gg/Hakkimda.htm" _fcksavedurl="http://mrossi.tr.gg/Hakkimda.htm">Hakkımda</a></li>  </ul>  <h3 class="headerbar">Webmaster</h3> <ul> <li><a href="http://mrossi.tr.gg/Usebarlar.htm" _fcksavedurl="http://mrossi.tr.gg/Usebarlar.htm" >Usebarlar</a></li> <li><a href="http://mrossi.tr.gg/ikon-arsivi.htm" _fcksavedurl="http://mrossi.tr.gg/ikon-arsivi.htm">İkon Arşivi</a></li>  <li><a href="http://mrossi.tr.gg/Yararli-Web-Siteleri.htm" _fcksavedurl="http://mrossi.tr.gg/Yararli-Web-Siteleri.htm">Modifiye Site</a></li>  <li><a href="http://mrossi.tr.gg/Htlm-Kodlari.htm" _fcksavedurl="http://mrossi.tr.gg/Htlm-Kodlari.htm">Html Kodları</a></li> <li><a href="http://mrossi.tr.gg/Tasarimlar.htm" _fcksavedurl="http://mrossi.tr.gg/Tasarimlar.htm">Css Tasarımlar</a></li> <li><a href="http://mrossi.tr.gg/Tasarimlar2.htm" _fcksavedurl="http://mrossi.tr.gg/Tasarimlar2.htm">Css Tasarımlar2</a></li>  </ul>   <h3 class="headerbar">Bİzİm Oda</h3> <ul> <li><a href="http://mrossi.tr.gg/Atat.ue.rk.htm" _fcksavedurl="http://mrossi.tr.gg/Atat.ue.rk.htm">Atatürk</a></li> <li><a href="http://mrossi.tr.gg/Oyunlar.htm" _fcksavedurl="http://mrossi.tr.gg/Oyunlar.htm">Oyunlar</a></li> <li><a href="http://haber7.com" _fcksavedurl="http://haber7.com">Haberler</a></li> <li><a href="http://mrossi.tr.gg/G.ue.zel-S.oe.zler.htm" _fcksavedurl="http://mrossi.tr.gg/G.ue.zel-S.oe.zler.htm">Güzel Sözler</a></li> <li><a href="http://mrossi.tr.gg/ilginc-Bilgiler.htm" _fcksavedurl="http://mrossi.tr.gg/ilginc-Bilgiler.htm">İlginç Bilgiler</a></li> <li><a href="http://mrossi.tr.gg/Osmanli-Devleti.htm" _fcksavedurl="http://mrossi.tr.gg/Osmanli-Devleti.htm">Osmanlı Devleti</a></li>  </ul>    <h3 class="headerbar">SaĞlık</h3> <ul> <li><a href="http://mrossi.tr.gg/Grip.htm" _fcksavedurl="http://mrossi.tr.gg/Grip.htm">Grip</a></li> <li><a href="http://mrossi.tr.gg/AIDS.htm" _fcksavedurl="http://mrossi.tr.gg/AIDS.htm">AIDS</a></li> <li><a href="http://mrossi.tr.gg/Kanser.htm" _fcksavedurl="http://mrossi.tr.gg/Kanser.htm">Kanser</a></li> <li><a href="http://mrossi.tr.gg/Menopoz.htm" _fcksavedurl="http://mrossi.tr.gg/Menopoz.htm">Menepoz</a></li>   </ul>     <h3 class="headerbar">Messenger</h3> <ul> <li><a href="http://mrossi.tr.gg/Messenger-Nedir.htm" _fcksavedurl="http://mrossi.tr.gg/Messenger-Nedir.htm" >Msn Nedir</a></li> <li><a href="http://mrossi.tr.gg/Msn-Nickleri.htm" _fcksavedurl="http://mrossi.tr.gg/Msn-Nickleri.htm">Msn Nickleri</a></li> <li><a href="http://mrossi.tr.gg/Msn-Arkaplanlari.htm" _fcksavedurl="http://mrossi.tr.gg/Msn-Arkaplanlari.htm">Msn Arkaplanları</a></li>  </ul>     <h3 class="headerbar">İslamİyet</h3> <ul> <li><a href="http://mrossi.tr.gg/Dinimiz.htm" _fcksavedurl="http://mrossi.tr.gg/Dinimiz.htm">Dinimiz</a></li> <li><a href="http://mrossi.tr.gg/Dini-Bilgiler.htm" _fcksavedurl="http://mrossi.tr.gg/Dini-Bilgiler.htm">Dini Bilgiler</a></li>   </ul>   <h3 class="headerbar">Dost Sİteler</h3> <ul> <li><a href="http://mrseto.tr.gg" _fcksavedurl="http://mrseto.tr.gg">Mrseto</a></li> <li><a href="http://bayvet.tr.gg" _fcksavedurl="http://bayvet.tr.gg">Bayvet</a></li> <li><a href="http://esintinet.tr.gg/" _fcksavedurl="http://esintinet.tr.gg/">Esintinet</a></li> <li><a href="http://roportajtr.tr.gg" _fcksavedurl="http://roportajtr.tr.gg">Roportajtr</a></li> <li><a  href="http://www.mrhypnaty.tr.gg" _fcksavedurl="http://www.mrhypnaty.tr.gg">MrHypnaty</a></li> <li><a href="http://webbilgievi.tr.gg" _fcksavedurl="http://webbilgievi.tr.gg">Webbilgievi</a></li>       </div> </div> <div class="icerikosman">

Alt

Css

iframe{border:solid 4px #000000;}  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;}  * {padding: 0; margin:0 }  body { margin-left:  auto; margin-right: auto; background: url(  https://img.webme.com/pic/m/mrossi/arkpv5.bmp  ) top center fixed; }  #tasarim{ width: 900px; margin-left:  auto; margin-right: auto; }    #ust{ margin-left:  auto; margin-right: auto; background: url( https://img.webme.com/pic/m/mrossi/v5ustt.png  ); width: 900px; height: 175px; float: left; }  .logo {     } .reklamalani { width:468px; height:70px; padding: 33px 0 0 395px; float: left; overflow: hidden; }  .ustmenuosman { width:750px; height:20px; padding: 30px 0 0 146px; float: left; font-size: 15px; color: #000000; font-family: century gothic; overflow: hidden; } #orta{ margin-left:  auto; margin-right: auto; background: url( https://img.webme.com/pic/m/mrossi/v5orta.png ); width: 900px; height: 100%; float: left; }  .menuosman{ width:195px; float: left; padding: 0 0 0 25px; overflow: hidden; }  .icerikosman { width:640px; float: left; padding: 0 0 0 19px; overflow: hidden; text-align: justify; }  .altreklam{ float: left; width:470px; height:70px; padding: 6px 0  0 39px;}     #alt{ margin-left:  auto; margin-right: auto; background: url( https://img.webme.com/pic/m/mrossi/v5alt2.png ); width: 900px; height: 125px; float: left;   }       input { padding: 2px; margin-right: 1px; background-image: url(https://img.webme.com/pic/m/mrossi/brder16.bmp); border: 1px solid #696969; border-left:5px solid #696969; color: #CA143C; font-Arial ; font-size:13px; } input:hover{ padding: 2px; margin-right: 1px; background-image: url(https://img.webme.com/pic/m/mrossi/brder16.bmp); border: 1px solid #FF0000; border-left:5px solid #FF0000; color: #FF0000; font-Arial; font-size:13px; } textarea { padding: 2px; margin-right: 1px; background-image: url(https://img.webme.com/pic/m/mrossi/brder16.bmp); border: 1px solid  #696969; border-left:5px solid  #696969; color: #FF0000; font-Arial; font-size:13px; } textarea:hover { padding: 2px; margin-right: 1px; background-image: url(https://img.webme.com/pic/m/mrossi/brder16.bmp); border: 1px solid #FF0000; border-left:5px solid #FF0000; color: #FF0000; font-Arial; font-size:13px; }    a:link, a:visited { 	color: #000000; 	text-decoration: none; 	font-weight: ; }    a:hover { 	text-decoration: none; 	color: gray; }    ::-moz-selection { background:#arkaplanrengi; color:#FF0000; }