CSS padding Свойство
Пример
Установите отступ для всех четырех сторон элемента <p> до 35 пикселей:
p {
padding: 35px;
}
Подробнее примеры ниже.
Определение и использование
Заполнение элемента — это пространство между его содержимым и его границей.
padding свойство является сокращенным свойством для свойства Padding-Top, Padding-right, Padding-Bottom и Padding-Left.
Примечание: Заполнение создает дополнительное пространство внутри элемента, в то время как Margin создает дополнительное пространство вокруг элемента.
Это свойство может иметь от одного до четырех значений.
Если свойство Padding имеет четыре значения:
- padding:10px 5px 15px 20px;
- top padding is 10px
- right padding is 5px
- bottom padding is 15px
- left padding is 20px
Если свойство Padding имеет три значения:
- padding:10px 5px 15px;
- top padding is 10px
- right and left padding are 5px
- bottom padding is 15px
Если свойство Padding имеет два значения:
- padding:10px 5px;
- top and bottom padding are 10px
- right and left padding are 5px
Если свойство Padding имеет одно значение:
- padding:10px;
- all four paddings are 10px
Примечание: Отрицательные значения не допускаются.
| Значение по умолчанию: | 0 |
|---|---|
| Inherited: | no |
| Animatable: | yes, see individual properties. Читайте о animatable |
| Version: | CSS1 |
| Синтаксис JavaScript: | object.style.padding="100px 20px" |
Поддержка браузера
Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
| Свойство | |||||
|---|---|---|---|---|---|
| padding | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Синтаксис CSS
padding: length|initial|inherit;
Значения свойств
| Значение | Описание | |
|---|---|---|
| length | Задает заполнение в пикселах, PT, cm и т.д. Значение по умолчанию — 0. Читать о единицах длины | |
| % | Задает заполнение в процентах от ширины содержащего элемента | |
| 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 Padding
CSS Справочник: CSS Box Model
HTML DOM Справочник: padding Свойство