Padding հատկությունը

padding հատկությունը սահմանում է տարրի ներքին բացը: Հատկության արժեքը կարող է լինել ցանկացած չափման միավոր: Լռելյայնորեն, յուրաքանչյուր բրաուզեր կարող է ավելացնել տարրերին տարբեր բացեր: Հատկությունը հապավում է հետևյալ հատկությունների համար՝ padding-top, padding-right, padding-bottom, padding-left:

Շարահյուսություն

cssընտրիչ {
  padding: արժեք;
}

Պարամետրերի քանակը

padding հատկությունը ընդունում է 1, 2, 3 կամ 4 արժեքներ, որոնք թվարկվում են բացատով առանձնացված՝

Օրինակ

Այս դեպքում լռելյայն ներքին բացը կլինի զրոյական, և տեքստը կսեղմվի բլոկի սահմանին.

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

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

Результат:

Օրինակ

Իսկ այժմ եկեք ստեղծենք 30px ներքին բաց.

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

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

Результат:

Օրինակ

Այժմ վերևից և ներքևից բացը կլինի 20px, իսկ աջից և ձախից՝ 5px.

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

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

Результат:

Օրինակ

Այժմ վերևից բացը 5px է, աջից՝ 15px, ներքևից՝ 25px, ձախից՝ 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;
}

Результат:

Տես նաև