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

Popüler yayınlar

HTML Metin Biçimlendirme Etiketleri

HTML em Etiketi

CSS justify-content Özelliği

HTML table Etiketi

HTML hr Etiketi

CSS flex-basis Özelliği

CSS align-items özelliği

HTML menu Etiketi

HTML embed Etiketi

CSS content Özelliği