border-width
Оновлено: 08.12.2022
border-width
Задає товщину рамки одночасно на всіх сторонах елемента або індивідуально для кожної сторони. Спосіб зміни товщини залежить від числа значень.
Коротка інформація
| Значення за замовчуванням | medium |
| Успадковується | Ні |
| Застосовується | До всіх елементів |
| Анімується | Так |
Синтаксис
border-width: [<розмір> | thin | medium | thick] {1,4}
Значення
Три змінні - thin (2 пікселі), medium (4 пікселі) і thick (6 пікселів) - задають товщину межі. Для більш точного значення товщину можна вказувати в пікселях або інших одиницях.
Дозволяється використовувати одне, два, три або чотири значення, розділяючи їх між собою пропуском. Ефект залежить від кількості та наведений у табл. 1.
Табл. 1. Залежність результату від числа значень
| Число значень | Результат |
|---|---|
| 1 | Залежність результату від числа значень. Товщина кордону буде встановлена для всіх сторін елемента. |
| 2 | Перше значення встановлює товщину верхньої та нижньої меж, друге - лівої та правої. |
| 3 | Перше значення задає товщину верхньої межі, друге - одночасно лівої та правої меж, а третє - нижньої межі. |
| 4 | По черзі встановлюється товщина верхньої, правої, нижньої та лівої меж. |
Приклад
Об'єктна модель
Об'єкт.style.borderWidth
Примітка
Браузер Internet Explorer до шостої версії включно за товщини кордону 1px відображає dotted як dashed. При товщині 2px і вище значення dotted працює коректно. Цю помилку виправлено в IE7, але тільки для всіх кордонів товщиною 1px. Якщо одна з меж блоку має товщину 2px і вище, то в IE7 значення dotted перетворюється на dashed.Товщина кордону під час використання ключових слів thin, medium і thick у різних браузерах може дещо відрізнятися.