css властивість padding-top
Властивість padding-top встановлює значення поля від верхнього краю вмісту елемента. Полем називається відстань від внутрішнього краю рамки елемента до уявного прямокутника, що обмежує його вміст.
Ви також можете використовувати властивість padding для скороченого запису padding-top, padding-right, padding-bottom і padding-left.
Якщо елемент має вказану ширину, будь-яке додавання до цього елемента полів, буде збільшувати його загальну ширину, що часто є небажаним результатом.
Щоб вирішити цю проблему, зберігаючи встановлену ширину елемента, незалежно від розміру полів, ви можете скористатись властивістю box-sizing.
| Нотатка: | Від'ємні значення не допускаються. |
| Нотатка: | CSS3 пропонує прибрати можливість використання в якості значень процентів, а також додати від'ємні значення, так само як і ключове слово |
Синтаксис
padding-top: length|initial|inherit;Властивість padding-top може отримувати 4 значення:
| Значення без задання: | 0 |
|---|---|
| Наслідує: | Ні |
| Анімується: | Так |
| JavaScript синтаксис: | object.style.paddingTop="50px" |
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
| padding-top | 1.0 |
4.0 |
1.0 |
1.0 |
3.5 |
| Переглядач | |||
|---|---|---|---|
| padding-top | 1.0 |
1.0 |
1.0 |
Мобільних переглядачів ще не додано.
Приклади
Динамічний приклад
Демонстрація роботи властивості
Як задати верхнє поле для елементу за допомогою властивості padding-top.
Встановлюємо внутрішній відступ зверху.
p {
padding-top: 2cm;
}