CSS top özelliği

tanım ve kullanım

top özelliği, elemanın üst kenarını belirtir. Bu özellik, bir konumlandırma elemanının üst dış kenarı ile içeriğin üst kenarı arasındaki kaymayı tanımlar.

not"position" özelliğinin değeri "static" ise, "top" özelliği hiçbir etki yaratmaz.

açıklama

Static elemanlar için oto; uzunluk değerleri için ilgili绝对长度的绝对长度; yüzdelik değerler için belirtilen değer; aksi takdirde oto.

Orantılı tanımlanan elemanlar için, top ve bottom hepsi auto ise, hesaplanmış değerler 0'dır; biri auto ise, diğerinin tam tersi alınır; her ikisi de auto değilse, bottom, top değerinin tam tersi alınır.

Ayrıca bakınız:

CSS eğitimi:CSS konumlandırma

HTML DOM referans kılavuzu:top özelliği

örnek

Resmin üst kenarını, içeren elemanın üst kenarının 5 piksel altına ayarlayın:

img
  {
  position:absolute;
  top:5px;
  }

Kendiniz deneyin

CSS dilbilgisi

top: auto|length|initial|inherit;

özellik değeri

değer tanım
oto Varsayılan değer. Tarayıcı, üst kenar konumunu hesaplar.
% İçerik elemanının üst konumunu yüzdelik olarak ayarlayın. Negatif değerler kullanılabilir.
length px, cm gibi birimlerle elemanın üst konumunu ayarlayın. Negatif değerler kullanılabilir.
inherit top özelliğinin değerini ebeveyn elemanından miras alması gerektiğini belirtir.

teknik ayrıntılar

Varsayılan değer: oto
miras özelliği: hayır
Sürüm: CSS2
JavaScript dilbilgisi: object.style.top="50px"

Daha fazla örnek

Sabit değerle resmin üst kenarını ayarlayın
Bu örnek, resmin üst kenarını sabit değerle nasıl ayarlayacağınızı gösterir.
Yüzdelikle resmin üst kenarını ayarlayın
Bu örnek, resmin üst kenarını yüzdelik değerle nasıl ayarlayacağınızı gösterir.

tarayıcı desteği

tablodaki rakamlar, bu özelliği tamamen destekleyen ilk tarayıcı sürümünü belirtmektedir.

Chrome IE / Edge Firefox Safari Opera
1.0 5.0 1.0 1.0 6.0