CSS ile Üst Üste Objeler - Katman Oluşturma (Tabaka - Layer)

CSS ile aynen photoshoptaki gibi katmanlar (layer) oluşturup bunları istediğimiz gibi kullanalabiliriz. CSS katmanları, z-index özelliğini birbirleriyle örtüşen öğelere uygulamak için kullanılır. Z-index özelliği ile position özelliği bu işelmin tamamlayıcılarıdır. Z-inden ile hangi öğenin üstte olması gerektiğini ve hangi öğenin alt kısımda olması gerektiğini belirtebilirsiniz.

z-index özelliği daha karmaşık web sayfası düzenleri oluşturmanıza yardımcı olabilir.

Aşağıda, CSS'de katmanların nasıl oluşturulacağını gösteren örnek verilmiştir.

<div style = "background-color:blue; 
	width:300px; 
	height:100px; 
	position:relative; 
	top:10px; 
	left:80px; 
	z-index:2">
</div>
<div style = "background-color:red; 
	width:300px; 
	height:100px; 
	position:relative; 
	top:-60px; 
	left:35px; 
	z-index:1;">
</div>
<div style = "background-color:orange; 
	width:300px; 
	height:100px; 
	position:relative; 
	top:-220px; 
	left:120px; 
	z-index:3;">
</div>

Örnek Çıktısı;

 

 

 
 
 


Etiketler: CSS

İlk yorumu siz yazın !..

  • Yorumunuz en az 30 karakter olmalıdır. (0)
Sitede Ara
  • Htaccess Nedir? .htaccess Komutları ve Örnekler
    Hocam iyi günler Google Web Search içerisinde bulunan 404 vermiş sayfaları 410 a çevirmek isityorum yap...
  • Sembol ve Karakterlerin Klavye Kısayolları - Alt Gr Tuş Kombinasyonları
    ALT GR değil ALT ....... ........
  • En İyi Mac Dönüştürücü - iSkysoft Video Converter Ultimate
    İndirip deniyorum hemen teşekkür ederim...
  • İnstagram Şekilli Profil Yazıları Oluşturma
    – єℓєşтιямє вєηιвєğєη∂ιуѕєη тαк∂ιя єт…нσşυηα gιтмιуσямυуυм кαƒαηα тαкмα ѕιктιя єт…...
  • Rüya Soyut Mu Somut Mu?
    Bu bilgiler benim bilim insanı olma bilgilerimi geliştirdi ve ayrıca ben çocuğum,kızım ve hayalimde ki ...
  • XP ne demek? XP nin anlamı nedir ?
    Roma dönemi konstantinin yaptığı simgeyi merak edip geldim ????...
  • Yeni başlayanlara En iyi 10 Kore dizisi
    Güzel liste. İlgimi çeken diziler oldu. Kill me heal me ve boys over flowers da olabilirmiş listede. ...