Bottom aýratynlygy

bottom aýratynlygy elementiň aşaky gyrasynyň ýerleşişini kesgitleýär. Aýratynlyk üçin bahalar ady ölçeg birlikleri bilen ýazyp bolýar, mysal üçin, pikselde, dýuýmda, punktda, göterimde. Görkezilýän bahalar tertipli sanam hem bolup biler, bu ýagdaýda elementler biri-biriniň üstüne goýlar. Koordinatalaryň hasaby position aýratynlygy tarapyndan kesgitlenýär, ýagny köplenç relative (nisbi ýerleşiş) ýa-da absolute (absolýut ýerleşiş) bahasyny alýar.

Sintaksis

cssselektor {
  bottom: ölçeg birligi bilen san ýa-da auto;
}

Mysal

Çagasy element üçine gelinende onyň aşaky çäginiň ýerleşişini 25px deň kesgitläliň:

html<div id="elem">
  <p></p>
</div>
css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-top: 50px;
}
p:hover {
  bottom: 25px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Mysal

Indi çagasy element üçine gelinende onuň aşaky çägi -50px ýerleşsin:

html<div id="elem">
  <p></p>
</div>
css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-top: 50px;
}
p:hover {
  bottom: -50px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Şeýle-de serediň

  • top aýratynlygy,
    ýagny elementiň ýokarky gyrasynyň ýerleşişini kesgitleýän
  • left aýratynlygy,
    ýagny elementiň çep gyrasynyň ýerleşişini kesgitleýän
  • right aýratynlygy,
    ýagny elementiň sag gyrasynyň ýerleşişini kesgitleýän
  • ::backdrop ýalan-element,
    ýagny birinji elementden soňky ýerleşişi kesgitleýän
  • caption-side aýratynlygy,
    ýagny tablisanyň at başlygynyň ýerleşişini kesgitleýän