CSS top Özelliği

CSS top

Css top özelliği ile durağan halde bulunmayan html elementlerinin konumları düzenlenebilir.

Örnek:

Bu örnekte kapsayıcısı içinde bulunan küçük kutu büyük kutuya göre 150px uzaklıktadır.

div.relative { position: relative; width: 250px; height: 280px; border: 2px solid yellow; } div.absolute { position: absolute; top: 150px; width: 100px; height: 100px; border: 2px solid blue; }

CSS top nedir nasıl kullanılır

Css top özelliğini kullanırken dikkat edilmesi gereken elementin position değeridir.Bu değer varsayılan olarak relative dir.Yani eleman durağan haldedir.Top değeri girilse bile eleman konum değiştirmez.

CSS top CSS top özellikleri  
Varsayılan Değer: auto  
Kalıtsallık: yok  
Animasyon Özelliği: var
Versiyon: CSS2  
JavaScript top: object.style.top="400px"

CSS top Tarayıcı Desteği

Talodaki sayılar özelliği ilk destekleyen tarayıcı versiyonlarıdır.

CSS Kodu:
top 1.0 5.0 1.0 1.0 6.0

CSS top Değerleri

top: auto|length|initial|inherit;

CSS top özelliği değerleri

CSS top değerleri CSS top değerleri tanımları CSS örnek uygulamalar
auto Tarayıcının otamatik varsayılan değeridir.
length Px cm gibi sayısal değer verilir.
% Yüzde olarak değer girilir.
initial Özelliğin varsayılan değeridir.
inherit Kalıtsal olarak aldığı değerdir.  

Yorumlar

Bu blogdaki popüler yayınlar

HTML yorum etiketi ile öğe gizleme örneği

HTML Resimler

Html5 canvas animasyon dersleri Javascript Yilan Oyunu

Javascript ile neler yapılabilir

HTML blockquote Etiketi Örnek

YouTube Reklam Engelleyici

Linklerin Renklerini Değiştirme Örnek