1.ÖNCELİKLE ARKADAŞLAR BİR CSS TASARIMI SEÇİYORUZ.CSS TASARIMLARINA GÖZ ATMAK İÇİN BELLİ BAŞLI SİTELER:
Free CSS Templates.Org
Free CSS.Com
Free CSS Templates.Com
Open Designs.Org
Open Web Design.Org
Metamorphozis.Com
Mantisatemplates.Com
Ramblingsoul.Com
2.BU SİTELERDEN KENDİNİZE UYGUN BİR TASARIM SEÇİN VE DOWNLOAD EDİN
3.ÇIKARTTIĞIMIZ DOSYALARDAN İMAGES KLASÖRÜ İÇERİSİNDEKİ RESİMLERİ UPLOAD EDELİM.UPLOAD ETMEK İÇİN BEDAVA SİTEM RESİMLERİMİ YÖNET KATEGORİSİNDEN DE YAPILABİLİR YADA HIZLIUPLOAD SİTESİNDEN YARARLANABİLİRSİNİZ:
4.RESİMLERİ UPLOAD ETTİKTEN SONRA KLASÖR İÇERİSİNDE DEFAULT(İSMİ STYLE VEYA CSS DİYEDE GEÇEBİLİR) TEXT DOSYASINI AÇALIM.AÇTIKTAN SONRA RESİM LİNKLERİNİ BİZİM UPLOAD ETTİĞİMİZ RESİM LİNKLERİYLE DEĞİŞTİRELİM.BURASI TASARIMIMIZ AÇISINDAN OLDUKÇA ÖNEMLİDİR.
ÖRNEK:url(terrah.png) yerine url(http://bedavasitem.com/images/n/cahre.png) şeklinde değiştirelim:
5.BURASI OLDUKÇA ÖNEMLİ.ŞİMDİ ÇOĞU KİŞİNİN ZORLANDIĞI TASARIM AYIRMA KISMINA GELDİK.KAYNAK KODUNU YENİ BİR METİN BELGESİNE KOPYALAMIŞTIK.ŞİMDİ O KODLAR ÜZERİNDE İLK OLARAK :
a)KODLARIN EN BAŞINDAN <body> DE DAHİL OLMAK ŞARTIYLA SİLELİM:
6.ŞİMDİ SİLME İŞLEMİNE DEVAM EDECEĞİZ BU SEFERDE İÇERİK KISMINI SİLECEYİZ.ÇÜNKÜ SİLMEZSEK BİZİM İÇERİKLERİMİZ SİTEMİZDE BU TASARIMDA GÖRÜNMEYECEKTİR.BU YÜZDEN İÇERİK(CONTENT) KISMINI SİLELİM:
7.İÇERİK KISMINI SİLMEK İÇİN <div id="content"> DEN SONRASI </div> DEN ÖNCESİNE KADAR SİLELİM(ÖNEMLİ)
8.<div id="content"> DAHİL OLMAK ÜZERE BU KODU TASARIM ÜSTÜNE YAPIŞTIRALIM:
9.</div> DAHİL OLMAK ÜZERE ONDAN SONRAKİ KODLARI TASARIM ALTINA YAPIŞTIRALIM:
10.KODLARI TASARIM ÜSTÜ VE TASARIM ALTI DİYE AYIRDIKTAN SONRA CSS KODUNA GELDİ SIRA.CSS KODU İÇİN:
a)ÖNCELİKLE AŞAĞIDAKİ KODU YAPIŞTIRIN:
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;}
BU KOD MENÜ GİZLEME KODUDUR.
b)YUKARDAKİ KODU YAPIŞTIRDIKTAN SONRA ONUN ALTINA DEFAULT(STYLE/CSS) KODUNU KOYALIM.
EVET TASARIMIMIZI TASARIM ÜSTÜ,TASARIM ALTI VE CSS OLARAK 3 KODA AYIRDIK
İyi Kullanmalar Ekstra Kodlar:
CSS TASARIMLARINDA ÖZEL KODLAR
BEDAVA-SİTEM REKLAMLARINI ORTALAMA
(CSS KODUNUN ALTINA YAPIŞTIRIN)
table {margin-left: auto;margin-right: auto}
ZİYARETÇİ DEFTERİ VEYA YORUM YAZMA KISMI
BÖLÜMÜNE RESİM YERLEŞTİRME KODU
(CSS KODUNA YAPIŞTIRINIZ)
#kommentartext { background-image:url(ARKAPLAN RESMİ); }
MENÜ GİZLEME KODU
<style type="text/css"> <!--
td.nav {visibility:hidden;}
--> </style>
SİTEYİ ORTALAMA KODU
<style type="text/css"> <!--
html, body {
text-align: center;
}
--> </style>
ARKAPLAN YAPMA KODU
<style type="text/css"> <!--
body{background-image:url(RESMİN URL'Sİ BURAYA YAZILACAK);background-attachment: fixed}
--> </style>
KAYDIRMA ÇUBUĞU
<div style="overflow: auto; width: 300px; height: 200px">yazı buraya</div>
SAYAÇ VE EKSTRALARIN YAZI BOYUTUNU KÜÇÜLTME
<font color="#ffffff"><font face="Comic Sans MS" size=2>
TEXT MENÜ KODU
<!-- begin class menu --> <div class="menu"> <ul> <li><a href="siteadı.tr.gg" _fcksavedurl="siteadı.tr.gg">sayfanızın adı</a></li> </ul> </div> <!-- end class menu -->a)FİREFOX VE İNTERNET EXPLORERDA SİTE ORTALAMAK İÇİN(TASARIM ÜZERİNE)
<div align="center"><table border="0" width="70%"><tr><td>
b)FİREFOX VE İNTERNET EXPLORERDA SİTE ORTALAMAK İÇİN(TASARIM ALTNA)
</td></tr></table></div>
ORTA ALANI GENİŞLETME
<style type="text/css"> <!--
table.edit_main_table{width: 100% !important;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 15% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 15% !important;}
td.edit_rechts_cbg{width:100%;}
--> </style>
BAŞLIK RESMİNİ GENİŞLETE
<style type="text/css"> <!--
td.edit_header_full{width: 100% !important;background-repeat:no-repeat;background-position:center center;background-image: url(BAŞLIK RESMİ URLSİ);}
--> </style>
BAŞLIK RESMİNİ DEĞİŞTİRMEK İÇİN TASARIM ÜZERİNE YAPIŞTIRMANIZ YETERLİDİR
İyi Kullanmalar:
