CSS border-width Property
Przykład
Ustaw szerokość granic:
div {border-width: thin;}
Więcej przykładów „Wypróbuj sam” poniżej.
Definicja i użycie
Właściwość border-widthustawia szerokość czterech obramowań elementu. Ta właściwość może mieć od jednej do czterech wartości.
Przykłady:
- szerokość obramowania: cienka średnia gruba 10px;
- górna granica jest cienka
- prawa krawędź jest średnia
- dolna ramka jest gruba
- lewa ramka to 10px
- szerokość obramowania: cienka średnia gruba;
- górna granica jest cienka
- prawe i lewe obramowania są średnie
- dolna ramka jest gruba
- szerokość obramowania: cienka średnia;
- górna i dolna granica są cienkie
- prawe i lewe obramowania są średnie
- szerokość obramowania: cienka;
- wszystkie cztery obramowania są cienkie
Uwaga: Zawsze deklaruj właściwość border-style przed border-width
właściwością. Element musi mieć obramowanie, zanim będzie można ustawić szerokość.
| Domyślna wartość: | średni |
|---|---|
| Dziedziczny: | nie |
| Animowalny: | tak. Przeczytaj o animacji |
| Wersja: | CSS1 |
| Składnia JavaScript: | obiekt .style.borderWidth="1px 5px" |
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.
| Property | |||||
|---|---|---|---|---|---|
| border-width | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Składnia CSS
border-width: medium|thin|thick|length|initial|inherit;
Wartości nieruchomości
| Value | Description | Play it |
|---|---|---|
| medium | Specifies a medium border. This is default | |
| thin | Specifies a thin border | |
| thick | Specifies a thick border | |
| length | Allows you to define the thickness of the border. Read about length units | |
| initial | Sets this property to its default value. Read about initial | |
| inherit | Inherits this property from its parent element. Read about inherit |
Więcej przykładów
Przykład
Ustaw szerokość granic na średnią:
div {border-width: medium;}
Przykład
Ustaw szerokość obramowań na grube:
div {border-width: thick;}
Przykład
Ustaw szerokość obramowania na 1px:
div {border-width: 1px;}
Przykład
Ustaw szerokość obramowania na 15px:
div {border-width: 15px;}
Przykład
Ustaw szerokość górnej i dolnej granicy na 10px, a szerokość lewej i prawej krawędzi na 1px:
div {border-width: 10px 1px;}
Powiązane strony
Samouczek CSS: obramowanie CSS
Odniesienie HTML DOM: właściwość borderWidth