Więcej "Try it Yourself" przykłady poniżej.
Definicja i Wykorzystanie
Własność border-style ustawia styl elementu czterech granic. Ta właściwość może mieć od jednego do czterech wartości.
Przykłady:
- border-style:dotted solid double dashed;
- górna granica jest przerywana
- prawe obramowanie jest stałe
- dolnej granicy jest podwójnie
- lewa granica jest przerywana
- border-style:dotted solid double;
- górna granica jest przerywana
- Granice prawej i lewej są stałe
- dolnej granicy jest podwójnie
- border-style:dotted solid;
- Górne i dolne granice są przerywana
- Granice prawej i lewej są stałe
- border-style:dotted;
- wszystkie cztery granice są przerywana
| Domyślna wartość: | none |
|---|---|
| Dziedziczny: | no |
| Animatable: | no. Read about animatable |
| Wersja: | CSS1 |
| Składnia JavaScript: | object .style.borderStyle="dotted double" Try it |
Pomoc Browser
Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje właściwość.
| Nieruchomość | |||||
|---|---|---|---|---|---|
| border-style | 1,0 | 4,0 | 1,0 | 1,0 | 3,5 |
Note: Wartość "hidden" nie jest obsługiwana w IE7 i wcześniejszych. IE8 wymaga! DOCTYPE. IE9 a później wsparcie "hidden" .
Składnia CSS
border-style:none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;wartości nieruchomości
| Wartość | Opis | Graj |
|---|---|---|
| none | Domyślna wartość. Określa brak granicę | Graj " |
| hidden | Tak samo jak "none" , z wyjątkiem rozwiązania konfliktu granicznego dla elementów tabeli | Graj " |
| dotted | Określa przerywaną granicę | Graj " |
| dashed | Określa przerywaną granicę | Graj " |
| solid | Określa stałą granicę | Graj " |
| double | Określa podwójne obramowanie | Graj " |
| groove | Określa rowkowane granicę 3D. Efekt zależy od wartości granicznej kolorów | Graj " |
| ridge | Określa prążkowane granicę 3D. Efekt zależy od wartości granicznej kolorów | Graj " |
| inset | Określa granicę 3D wstawka. Efekt zależy od wartości granicznej kolorów | Graj " |
| outset | Określa początku granicę 3D. Efekt zależy od wartości granicznej kolorów | Graj " |
| initial | Ustawia tę właściwość na wartość domyślną. Przeczytaj o początkowej | Graj " |
| inherit | Dziedziczy nieruchomość od swojego rodzica. Przeczytaj o dziedziczą |
Więcej przykładów
Przykład
Ustaw różne granice na każdym boku elementu:
p.one {border-style: dotted solid dashed double;}
p.two {border-style:
dotted solid dashed;}
p.three {border-style: dotted solid;}
p.four
{border-style: dotted;} Spróbuj sam " Podobne strony
Kurs CSS: CSS Border
HTML DOM referencyjny: borderStyle property