СSS Свойство padding
Пример
Установить отступ для всех четырех сторон элемента <p> равным 35 пикселям:
p {
padding: 35px;
}
Попробуйте сами »
Определение и использование
Элемент padding - это пространство между содержимым и границей.
Свойство padding
- это сокращенное свойство для:
Примечание: Padding создает дополнительное пространство внутри элемента, в то время как margin создает дополнительное пространство вокруг элемента.
Свойство padding может иметь от одного до четырех значений.
Если свойство padding имеет четыре значения:
- padding:10px 5px 15px 20px;
- верхний отступ 10px
- правый отступ 5px
- нижний отступ 15px
- левый отступ 20px
Если свойство padding имеет три значения:
- padding:10px 5px 15px;
- top padding is 10px
- правый и левый отступ по 5px
- нижний отступ 15px
Если свойство padding имеет два значения:
- padding:10px 5px;
- верхний и нижний отступ по 10px
- правый и левый отступ по 5px
Если свойство padding имеет одно значение:
- padding:10px;
- все четыре отступа по 10px
Примечание: Отрицательные значения не допускаются.
Значение по умолчанию: | 0 |
---|---|
Унаследованный: | нет |
Анимируемый: | да, см. раздел отдельные свойства. Прочитать о animatable Попробовать |
Версия: | CSS1 |
JavaScript синтаксис: | object.style.padding="100px 20px" Попробовать |
Поддержка браузеров
Числа в таблице указывают первая версия браузер, который полностью поддерживает свойство.
Свойство | |||||
---|---|---|---|---|---|
padding | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
CSS Синтаксис
padding: length|initial|inherit;
Значения свойств
Значение | Описание | Воспроизвести |
---|---|---|
length | Задает отступ в px, pt, cm и т.д. Значение по умолчанию 0. Прочитать о Eдиницы длины | Воспроизвести » |
% | Задает отступ в процентах от ширины содержащего элемента | Воспроизвести » |
initial | Устанавливает это свойство в значение индекса. Прочитать о initial | Воспроизвести » |
inherit | Наследует это свойство от родительского элемента. Прочитать о inherit |
Примеры
Пример
Установить отступ для элемента <p> до 35 пикселей для верхнего и нижнего, и до 70 пикселей для правого и левого:
p {
padding: 35px 70px;
}
Попробуйте сами »
Пример
Установить отступ для элемента <p> до 35 пикселей для верхней, 70 пикселей для правого и левого, и в 50 пикселей для нижней:
p {
padding: 35px 70px 50px;
}
Попробуйте сами »
Пример
Установить отступ для элемента <p> в 35 пикселов сверху, 70 пикселов справа, 50 пикселов снизу и 90 пикселов слева:
p {
padding: 35px 70px 50px 90px;
}
Попробуйте сами »
Связанные страницы
CSS Учебник: CSS Отступы
CSS Учебник: CSS Бокс модель
HTML DOM Справочник: Свойство padding