padding-left CSS

Свойство padding-left устанавливает значение поля от левого края содержимого элемента. Полем называется расстояние от внутреннего края рамки элемента до воображаемого прямоугольника, ограничивающего его содержимое (рис. 1).

Рис. 1. Поле слева от текста
Рис. 1. Поле слева от текста

Значение по умолчанию:

0

Наследуется:
Нет
Применяется:

Ко всем элементам

Анимируется:
Да
Объект JavaScript:

object.style.paddingLeft

Спецификации:

Синтаксис

/* <length> values */
padding-left: 0.5em;
padding-left: 0;
padding-left: 2cm;

/* <percentage> value */
padding-left: 10%;

/* Global values */
padding-left: inherit;
padding-left: initial;
padding-left: unset;

Значения

Величину левого поля можно указывать в пикселях (px), процентах (%) или других допустимых для CSS единицах.

Примеры

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>padding-left</title>
  <style>
   .layer {
    background: #fc3; /* Цвет фона */
    border: 2px solid black; /* Параметры рамки */
    padding: 5px; /* Поля вокруг текста */
   }
   .layer p {
    margin: 0; /* Убираем отступы вокруг */
    padding-left: 10%; /* Поле слева */
   }
  </style>
 </head>
 <body> 
  <div class="layer">
   <p>Кондуктометрия мягко передает электронный способ 
   получения независимо от последствий проникновения 
   метилкарбиола внутрь.</p>
  </div>
 </body>
</html>