css властивість padding-left
Властивість padding-left встановлює внутрішній відступ ліворуч.
Ви також можете використовувати властивість padding для скороченого запису padding-top, padding-right, padding-bottom і padding-left.
Якщо елемент має вказану ширину, будь-яке додавання до цього елемента полів, буде збільшувати його загальну ширину, що часто є небажаним результатом. Щоб вирішити цю проблему, зберігаючи встановлену ширину елемента, незалежно від розміру полів, ви можете скористатись властивістю box-sizing.
- Нотатка
-
Від'ємні значення не допускаються.
автор: Svitlana - Нотатка
-
CSS3 пропонує прибрати можливість використання в якості значень процентів, а також додати від'ємні значення, так само як і ключове слово
автор: Svitlanaauto.
Синтаксис
padding-left: length|initial|inherit;Властивість padding-left може отримувати 4 значень:
-
length -
Встановлює відстань поля у
автор: Svitlanapx, pt, cmта інших одиниця, що прийняті в CSS. -
% -
Встановлює відступ у відсотках відносно ширини елементу.
автор: Svitlana -
initial -
Встановлює властивість у значення без задання
автор: Svitlana -
inherit -
Вказує на спадковість властивості від свого батьківського елемента.
автор: Svitlana
| Значення без задання: | 0 |
|---|---|
| Наслідує: | Ні |
| Анімується: | Так |
| JavaScript синтаксис: | object.style.paddingLeft="50px" |
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
|---|---|---|---|---|---|
| padding-left | 1.0 | 1.0 | 1.0 | 3.5 | 4.0 |
| Переглядач |  |
 |
 |
|---|---|---|---|
| padding-left | 1.0 | 1.0 | 1.0 |
Приклади
+ запропонувати свій приклад у пісочниці
Внутрішній відступ 2см лише ліворуч — текст відсунувся, а тло лишилося до самої рамки.
HTML
<p class="pad">Абзац із відступом 2см ліворуч.</p>
<p>Звичайний абзац.</p>CSS
p {
border: 1px solid #0172ad;
background: #eef6ff;
}
.pad {
padding-left: 2cm;
}Динамічний приклад
Демонстрація роботи властивості
Як задати ліве поле для елементу за допомогою властивості padding-left.
Коментарі
Коментарів ще немає — будьте першим!