Ok LifeCity - LifeList ORTAK AÇIKLAMA- Yeni-Eski takipçilerimize

Ok KORG Pa3X Çıktı !
Kiralık Ses Sistemleri ( Piyanist Serdar Özcan )
Buradasınız : freecssuygulama

Online Destek

Bizi Destekleyin

Desteklediklerimiz

LifeCity - Tr.Gg | Css Tasarımlar | Html Kodlar | Webmaster Yardim | Tr.Gg

freecssuygulama

Bu sayfa en son 24.11.2009 tarihinde güncellenmiştir !

 < Web Dersleri'ne Geri Don <

Öncelikle tasarımımızı seçiyoruz

Free-Css.com


veya buradan

FreeCssTemplates.org

Sonra tasarımımızı indirip masa üstüne çıkartıyoruz ve sırasıyla şu adımları izliyoruz

1-)Tasarımımızın içindeki images dosyasını bulup içindeki upload ediyoruz.Sonra upload ettiğimiz resimlerin linklerini bir word dosyası açıp içine kayıt ediyoruz.

Upload etmek için isterseniz sitenizin kendi hostunu kullanın isterseniz burayı 
İmagesHack.us

Not: Uploadı kendi sitenize yaptıysanız,Resimlerin'e geçip oradan upload ettiğiniz resimlerin url lerini ,resmin üzerine sağ tıklayıp özellikler diyerek alıyorsunuz,eğer İmageshack tan yaptıysanız( Direct link to image ) bu yazının karşısındaki url yi alıyorsunuz.

2-) İndirdiğiniz tasarımdan style dosyasını bulup,sağ tıkladıktan sonra birlikte aç tan bir word belgesi ile açıyoruz.Karşımıza şuna benzer kodlar çıkacak

#right_corner {float:right;height:84px;width:344px;
background:url(right_corner.png) no-repeat;}
#header_nav {width:100%;height:43px;margin:0 auto;
background:url(menu.jpg) repeat-x;

3-) Bu kodlarda kalınlaştırdığım yerdeki gibi resim uzantılı yerleri bulup,resim adlarına göre,önceden upload ettiğiniz resimleri kalın yerleri silip yapıştıracağız.

Örnek: 
http://img240.imageshack.us/img240/6672/18471011.png

Bu benim upload ettiğim resimlerden right_corner.png nin url si.Bu linki yukarıda kalınlaştırdığım yerlere resim ismine göre yapıştıracağız.

Kodumuz sonra böyle olacak:

#right_corner {float:right;height:84px;width:344px;
background:url(http://img240.imageshack.us/img240/6672/18471011.png) no-repeat;}
#header_nav {width:100%;height:43px;margin:0 auto;
background:url(menu.jpg) repeat-x;

4-) Tüm resimleri örnekteki gibi yerlerine yerleştirdikten sonra,style dosyasının içindeki bu kodun başına aşşağıdaki kodu da ekleyip css kodu kısmına yapıştırıyoruz ve kayıt ediyoruz.

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;}

Buradan sonra css yani style ile işimiz kalmadı.
-------------------------------------------

Sıra geldi tasarım üzeri ve altı olarak yarımaya

Eğer tasarımı bu siteden indirdiysek bu yolla ayırıyoruz ( Free-Css.com )
 
İndirdiğimiz dosyanın içindeki index dosyasını sağ tıklayıp birlikte aç dedikten sonra,yine bir word dosyası ile , dosyamızı açıyoruz ve karşımıza birsürü kod çıkıyor.

Kodların en başından buraya kadar olan yeri

<div class="left-box"> 

Tasarım üzeri bölümüne yapıştırıyoruz
----------------------------------------
<div class="left-box"> 

Buradan en alta kadar olan yeride Tasarım üzeri bölümüne yapıştırıyoruz

NOT''left-box'' Yazan yerde başka yazılarda olabilir sizin bakacağınız yer <div class dır.

Tasarımı bu siteden indirdiyseniz ( FreeCssTempaltes.org )

Tasarım Üstüne

....
....
....
....
... <div id="page">


Tasarım altına

</div>
.....
.....
.....



Yapıştırılacak buradan sonrası size kalmış,Menü linklerinizi ayarlayıp,sitenize ekleyin.

 

Bu Gün : 7
Klik : 126
IP Adresiniz : 44.220.44.148
PageRank Checker

Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol