Свойство padding-left устанавливает отступ с левой стороны элемента.
Отрицательные значения недопустимы.
Это свойство не имеет эффекта на строчных элементах, подобно <span>.
| Значение по умолчанию | 0 |
| Применяется | Ко всем элементам, кроме тех случаев, когда свойство display имеет значения table-row-group, table-header-group, table-footer-group, table-row, table-column-group и table-column. Также применяется к ::first-letter. |
| Наследуется | Нет |
| Анимируемое | Да. Отступ анимируем. |
| Версия | CSS1 |
| DOM синтаксис | object.style.paddingLeft = "40px"; |
Синтаксис
padding-left: length | initial | inherit;Пример
<!DOCTYPE html>
<html>
<head>
<title>Заголовок документа</title>
<style>
p {
border: 2px solid #000;
color: #1c87c9;
padding-left: 100px;
}
</style>
</head>
<body>
<h2>Пример свойства padding-left </h2>
<p>Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне.</p>
</body>
</html>Рассмотрим другой пример, где отступ равен "2cm":
Пример
<!DOCTYPE html>
<html>
<head>
<title>Заголовок документа</title>
<style>
p {
border: 2px solid #000;
color: #1c87c9;
padding-left: 3cm;
}
</style>
</head>
<body>
<h2>Пример свойства padding-left</h2>
<p>Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне.</p>
</body>
</html>Значения
| Значение | Описание |
|---|---|
| length | Устанавливает левый отступ в единицах измерения (px, pt, cm и т. д.). Значение по умолчанию - 0px. |
| % | Устанавливает левый отступ в процентах. |
| initial | Устанавливает свойство в значение по умолчанию. |
| inherit | Значение элемента наследуется от родительского элемента. |
Поддержка браузера
|
|
|
|
|
|---|---|---|---|
| 1.0+ | 1.0+ | 1.0+ | 3.5+ |
Практикуйте свои знания
Что делает свойство CSS 'padding-left'?
Правильный!
Неправильно!