Внутренние отступы

Последнее обновление: 21.04.2016

Свойство padding задает внутренние отступы от границы элемента до его внутреннего содержимого. Как и для свойство margin, в CSS имеются четыре свойства, которые устанавливают отступы для каждой из сторон:

  • padding-top: отступ сверху

  • padding-bottom: отступ снизу

  • padding-left: отступ слева

  • padding-right: отступ справа

Например:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Блочная модель в CSS3</title>
        <style>
			div.outer{
				
				margin: 25px;
				
				padding-top:30px;
				padding-right: 25px;
				padding-bottom: 35px;
				padding-left: 28px;
				
				border: 2px solid red;
			}
			div.inner{
				
				height: 50px;
				background-color:blue;
			}
        </style>
    </head>
    <body>
		<div class="outer">
			<div class="inner"></div>
		</div>
    </body>
</html>
Padding в CSS 3

Для установки значения отступов, как и в margin, могут применяться либо конкретные значения в пикселях, так и процентные значения (относительно размеров элементов).

Для записи отступов также можно использовать сокращенную запись:

padding: отступ_сверху отступ_справа отступ_снизу отступ_слева;

Например:

div.outer{
				
	margin: 25px;
	
	padding: 30px 25px 35px 28px;
				
	border: 2px solid red;
}

Если все четыре значения совпадают, то можно писать указать только одно значение для всех отступов:

div.outer{
				
	margin: 25px;
	
	padding: 30px;
				
	border: 2px solid red;
}

НазадСодержаниеВперед

Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850