Site Rehberi

TG Sitede sadece CSS ve kısmen Javascript dersleri bulunuyor.Javascript sadece ek özelliklerde kullandığım için %90 oranında CSS dersleri bulunuyor.Zaten tr.gg içinde en sade ve en açık yönlü kod dili CSS olduğu için diğer kod dilleriyle uğraşmanızı tavsiye etmem.Site hakkıda açıklama için.

» Burayı Tıklayın

CSS Tasarımlar

Boş Banner

icon Şimdilik bu bannere eklenecek bir oluşum düşünülmüyor sizdende istekler,düşünceler alabilirim.Bu banner hakkında fikir verin.Ve sizinde sitede imzanız olsun.

» İletişim için

TG The Codebreaker

1ktmn

Sitemizin Genel Katmanlarını Oluşturma



Oluşturacak olduğumuz şablonun temel görünümü şu şekilde olacak.

Oluşturduğumuz resimler arkaplanbaşlıküst kısımorta kısım ve alt kısım olmak üzere 5 ayrı parçadır. 

Siz resimleri kendinize göre düzenleyeceksiniz işin o kısmı size kalıyor.Photoshop ile sitenizin resimlerini halledebilirsiniz...

Kullanacağımız CSS kodlarının temel özellikleri için bu siteyi ziyaret etmenizi  öneririm.

a-) Öncelikle CSS kodlarının en başına menü gizleme kodumuzu yapıştıralım.

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



b-) Sonra sitemizin gövdesini (body'sini) oluşturacağız. Gövdede tanımlayacağımız bütün özellikler sitemizi etkileyecek. Font biçimi, fontların boyutu, arka planı resmi yada rengi, sitenin ortalaması vs... Eğer siz başka bir kodla aksini belirtmezseniz bütün özellikler bu kısımdan gelir. Mesela tabloların font boyutunu 10px yaptınız ama body'de 12px olarak font boyutu belirlediniz. Bu durumda tablolar hariç sitenizdeki bütün yazılar 12px büyüklüğünde olacak. Şimdi body'yi oluşturalım.

* { padding: 0; margin: 0; }

body { font-family: Arial;
font-size: 12px;
background: url(https://img.webme.com/pic/h/hackerfriend/hayalimarkaplan.jpg) top center fixed;

}

Hemen arkasından tasarımızın düzgün ve ortalı durması için bir katman oluşturalım. CSS katmanları # ile başlar. Katman özellikleri { ile başlar ve ile biter. Her katman özelliği arası noktalı virgül ; konur. Kodları inceleyerek daha iyi anlayabilirsiniz.

#tasarim {
margin: 0 auto;
width: 900px
}

Bu haliyle sitemizin görünümü buradaki gibi olacak.

TASARIM ÜZERİNDEKİ YAZI 
<div id="tasarim>

TASARIM ALTINDAKİ YAZI 
</div>

CSS KODU
Burayı tıklayınız...


Dersin Devamı İçin Tıklayın...


Site Hiti 13170 ziyaretçi (22852 klik)
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol