Top aýratynlygy

Top aýratynlygy elementleriň ýokarky gyrasynyň ýerleşişini atasynyň ýokarky gyrasyndan kesgitleýär. Aýratynlyk üçin bahalar adaty ululyk birliklerinde, mysal üçin, piksel, dýuým, punkt, göterim ýaly birikmelerde ýazylyp bilner. Berilýän bahalar sanam ters bahalar hem bolup biler, bu ýagdaýda elementler bir-biriniň üstüne goýlup biler. Koordinatalaryň hasaby position aýratynlygy bilen kesgitlenýär, ýöne adatça relative (göreli ýerleşiş) ýa-da absolute (absolýut ýerleşiş) bahalaryny alýar.

Sintaksis

s selektory {
	top: ululyk ýa-da auto;
}

Mysal

Çagyrylan element üstünde gezekläp ýörgende ol ýokarky çäk ýerleşişini 25px deň ornaýalyň:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-top: 50px;
	margin-left: 50px;
}
p:hover {
	top: 25px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Mysal

Indi bolsa gezekläp ýörgende çagyrylan elementleriň ýokarky çägi -50px ýerleşsin:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	margin-top: 50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-left: 50px;
}
p:hover {
	top: -50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Şeýle-de serediň

bottom aýratynlygy,
elementleriň aşak gyrasynyň ýerleşişini kesgitleýär
left aýratynlygy,
elementleriň çep gyrasynyň ýerleşişini kesgitleýär
right aýratynlygy,
elementleriň sag gyrasynyň ýerleşişini kesgitleýär
pseudoelement ::backdrop,
bir elementden soňky ýerleşişi kesgitleýär
caption-side aýratynlygy,
tablisanyň atlyk ýazgysynyň ýerleşişini kesgitleýär