Padding касиети

padding касиети элементдин ички төшөгүчүн белгилейт. Касиеттин мааниси катары өлчөө бирдиктеринин ар кандай түрү колдонулат. Демейки абалда ар бир браузер элементтерге ар кандай төшөгүчтөрдү кошсо болот. Бул касиет төмөндөгү касиеттер үчүн кыскартылган форма болуп саналат: padding-top, padding-right, padding-bottom, padding-left.

Синтаксис

селектор {
	padding: маани;
}

Параметрлердин саны

padding касиети 1, 2, 3 же 4 маанини кабыл алат, алар боштук менен айрылып берилет:

Саны	Сүрөттөмө
`1`	Бир маани элементтин бардык жагындагы төшөгүчтү белгилейт.
`2`	Биринчи маани жогорку жана төмөнкү төшөгүчтү белгилейт, ал эми экинчиси - оң жана сол жагындагы төшөгүчтөрдү.
`3`	Биринчи маани жогорку төшөгүчтү белгилейт, экинчиси - оң жана сол жагындагы төшөгүчтөрдү, ал эми үчүнчүсү - төмөнкү төшөгүчтү.
`4`	Биринчи маани жогорку төшөгүчтү белгилейт, экинчиси - оң жагындагы төшөгүчтү, үчүнчүсү - төмөнкү төшөгүчтү, ал эми төртүнчүсү - сол жагындагы төшөгүчтү.

Мисал

Бул учурда демейки ички төшөгүч нөлгө барабар болот жана текст блоктун чек арасына жабышып калат:

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

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

Мисал

Эми ички төшөгүчтү 30px кылалы:

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

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

Мисал

Азыркы учурда жогорку жана төмөнкү төшөгүч 20px болот, ал эми оң жана сол жагындагы төшөгүчтөр - 5px:

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

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

Мисал

Азыркы учурда жогорку төшөгүч 5px, оң жагындагы төшөгүч - 15px, төмөнкү төшөгүч - 25px, сол жагындагы төшөгүч - 35px:

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

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

Ошондой эле караңыз

margin касиети,
ал сырткы төшөгүчтү белгилейт