Padding häsiýeti

padding häsiýeti elementyň içki aralygyny kesgitleýär. Häsiýetiň bahasy bolsa istýän ölçeg birligi bolar. Başlangyç ýagdaýda, her bir brauzer elementlere dürli aralyklar goşup biler. Häsiýet şu häsiýetleriň gysga görnüşi: padding-top, padding-right, padding-bottom, padding-left.

Sintaksis

cssselektor {
  padding: baha;
}

Parametrleriň sany

padding häsiýeti 1, 2, 3 ýa-da 4 bahany boşluk bilen sanawlaýar:

Mysal

Bu ýagdaýda, başlangyç ýagdaýda içki aralyk nol we tekst blokyň çägine ýapyşar:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 0;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Mysal

Indi bolsa içki aralygy 30px edeliň:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 30px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Mysal

Häzirki wagtda ýokardan we aşakdan aralyk 20px, sagdan we çepden bolsa - 5px:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 20px 5px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Mysal

Häzirki wagtda ýokardan aralyk 5px, sagdan - 15px, aşakdan - 25px, çepden - 35px:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 5px 15px 25px 35px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Şeýle-de görüň