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 хусусияти,
ташки четини белгиловчи