css tasarım kodu var fakat html koduna nasıl cevırırım

arkadaslar elımde css tasarım kodu var fakat html koduna nasıl cevırırım bır yardımcı olursanız sevınırım sımdıden saolun!!

kodu css tasarımına uygula
______________

Ve ayrıca html koda dönüştüremezsin css ye al tasarımını gelişiş ayarlardan gereqli yerlere ekle Basarılar
______________

ben sana genişçe anlatıyım.İlk önce aldığın kodu kopyalayıp şu yolu izle:

1=>Tasarım ayarları
2=>Gelişmiş ayarlar
3.=Kodu "tasarımın üzerindeki yazı" bölgesine yapıştır
4.=>Kaydet

Eğer CSS kodunu hangi tasarımda kullandığını bilmiyorsan sırayla ıceblue,red,butterfly tasarımlarını kaydedip yapıştırmayı dene.

saolasın kardes

k.b ama yapamadım








ben size kode versem



/*
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
*/

body {
margin-top: 20px;
padding: 0;
background: #FDF9EE;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #6D6D6D;
}

h1, h2, h3 {
margin: 0;
text-transform: lowercase;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
color: #006EA6;
}

h1 {
letter-spacing: -1px;
font-size: 35px;
}

h2 {
font-size: 26px;
}

p, ul, ol {
margin: 0 0 2em 0;
text-align: justify;
line-height: 26px;
}

a:link {
color: #0094E0;
}

a:hover, a:active {
text-decoration: none;
color: #0094E0;
}

a:visited {
color: #0094E0;
}

img {
border: none;
}

img.left {
float: left;
margin: 7px 15px 0 0;
}

img.right {
float: right;
margin: 7px 0 0 15px;
}

/* Form */

form {
margin: 0;
padding: 0;
}

fieldset {
margin: 0;
padding: 0;
border: none;
}

legend {
display: none;
}

input, textarea, select {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 13px;
color: #333333;
}

#wrapper {
background: #7ACF00 url(images/img03.jpg);
}

/* Header */

#header {
width: 900px;
height: 40px;
margin: 0 auto 20px auto;
padding-top: 10px;
}

#logo {
float: left;
height: 40px;
margin-left: 10px;
}

#logo h1 {
float: left;
margin: 0;
font-size: 38px;
color: #0099E8;
}

#logo h1 sup {
vertical-align: text-top;
font-size: 24px;
}

#logo h1 a {
color: #0099E8;
}

#logo h2 {
float: left;
margin: 0;
padding: 20px 0 0 10px;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #6D6D6D;
}

#logo a {
text-decoration: none;
color: #FFFFFF;
}

/* Menu */

#menu {
float: right;
}

#menu ul {
margin: 0;
padding: 0;
list-style: none;
}

#menu li {
display: inline;
}

#menu a {
display: block;
float: left;
margin-left: 5px;
background: #0094E0;
border: 1px dashed #FFFFFF;
padding: 1px 10px;
text-decoration: none;
font-size: 12px;
color: #FFFFFF;
}

#menu a:hover {
text-decoration: underline;
}

#menu .active a {
}

/* Page */

#page {
width: 900px;
margin: 0 auto;
background: #FFFFFF;
border: 1px #F0E9D6 solid;
padding: 20px 20px;
}

/* Content */

#content {
float: left;
width: 600px;
padding-left: 10px;
}

/* Post */

.post {
}

.post .title {
margin-bottom: 20px;
padding-bottom: 5px;
padding-left: 40px;
background: url(images/img02.jpg) no-repeat left top;
border-bottom: 1px dashed #D1D1D1;
color: #8BCB2F;
}

.post .title b {
font-weight: normal;
color: #0094E0;
}

.post .entry {
}

.post .meta {
margin: 0;
padding: 15px 0 60px 0;
background: url(images/img04.jpg) repeat-x left 30%;
}

.post .meta p {
margin: 0;
line-height: normal;
}

.post .meta .byline {
float: left;
color: #0000FF;
}

.post .meta .links {
float: left;
}

.post .meta .more {
width: 185px;
height: 35px;
padding: 5px 10px;
background: #8BCB2F;
border: 1px dashed #FFFFFF;
text-transform: uppercase;
text-decoration: none;
font-size: 9px;
}

.post .meta .comments {
padding: 5px 10px;
text-transform: uppercase;
text-decoration: none;
background: #0094E0;
border: 1px dashed #FFFFFF;
font-size: 9px;
}

.post .meta b {
display: none;
}

.post .meta a {
color: #FFFFFF;
}
/* Sidebar */

#sidebar {
float: right;
width: 230px;
padding-right: 10px;
}

#sidebar ul {
margin: 0;
padding: 10px 0 0 0;
list-style: none;
}

#sidebar li {
margin-bottom: 40px;
}

#sidebar li ul {
}

#sidebar li li {
margin: 0;
padding: 3px 0;
border-bottom: 1px dashed #D1D1D1;
}

#sidebar li li a {
margin: 0;
padding-left: 15px;
background: url(images/img01.jpg) no-repeat left 50%;
}

#sidebar h2 {
padding-bottom: 5px;
font-size: 18px;
font-weight: normal;
color: #0094E0;
}

#sidebar strong, #sidebar b {
color: #8BCB2F;
}

#sidebar a {
text-decoration: none;
color: #6D6D6D;
}

/* Search */

#search {
}

#search h2 {
}

#s {
width: 150px;
margin-right: 5px;
padding: 3px;
border: 1px solid #F0F0F0;
}

#x {
padding: 3px;
background: #ECECEC url(images/img08.gif) repeat-x left bottom;
border: none;
text-transform: lowercase;
font-size: 11px;
color: #4F4F4F;
}

/* Boxes */

.box1 {
padding: 20px;
background: url(images/img05.gif) no-repeat;
}

.box2 {
color: #BABABA;
}

.box2 h2 {
margin-bottom: 15px;
background: url(images/img10.gif) repeat-x left bottom;
font-size: 16px;
color: #FFFFFF;
}

.box2 ul {
margin: 0;
padding: 0;
list-style: none;
}

.box2 a:link, .box2 a:hover, .box2 a:active, .box2 a:visited {
color: #EDEDED;
}

/* Footer */

#footer {
width: 880px;
margin: 0 auto;
padding: 10px 0 0 0;
color: #353535;
}

html>body #footer {
height: auto;
}

#footer-menu {
}

#legal {
clear: both;
font-size: 11px;
color: #6D6D6D;
}

#legal a {
color: #0094E0;
}

#footer-menu {
float: left;
color: #353535;
text-transform: capitalize;
}

#footer-menu ul {
margin: 0;
padding: 0;
list-style: none;
}

#footer-menu li {
display: inline;
}

#footer-menu a {
display: block;
float: left;
padding: 1px 15px 1px 15px;
background: url(images/img03.jpg) no-repeat right 50%;
text-decoration: none;
font-size: 11px;
color: #6D6D6D;
}

#footer-menu a:hover {
text-decoration: underline;
}

#footer-menu .active a {
padding-left: 0;
}

kardeş bu kodu nereden aldın hackerfriend mi

bıde senın dedıgın daha dogrusu sen benı yanlış anladın normal tasarım kodunu eklemeyı fln herseyı bılıyorum ama bu kod normal sıteler de kullanılan bır kod dur dedıgım gıbı ben kodun bnım sıteme uygun halını ıstemıstım ama cvp gelmedı

ındırmıs oldugun paketın ıcınde images dosyası var..
ordakı resımlerı sıtene yukle
usttekı style.css dosyasının ıcınde
images/img03.jpg); seklındekı kısımda
sıtendekı yukledıgın resımın uzerıne gelıp ozellıklerden resmın url sını al ve yerı yerıne yerlestır..

sonra kodu tasarıma ekle


paketın ıcındekı ındex yazan sayfayı kendıne gore lınklerı edıtle...


not hackerfrıend ın css saklama kodunu tasarıma kodunu eklemelısın...

Paylasımlarınız İçin Teşekkürler Umarız Arkadasımız işini hal etmiştir
______________