logo-tworzenie-stron-legnica

config

Style CSS

Spis alfabetyczny stylów CSS.

Ściąga CSS - przykłady, style CSS alfabetycznie, spis stylów CSS, właściwości CSS, skorowidz stylów CSS.


 

Strona w trakcie modernizacji

Zapraszamy wkrótce

Właściwość CSS border-style

Definicja stylu, przeznaczenie i użycie border-style

Właściwość border-style określa styl obramowania czterech granic elementu (ramek). Ta właściwość może mieć od jednej do czterech wartości.

Wartości właściwości border-style

Wartość Opis
none Brak obramowania. Ustawienie domyślne.
hidden To samo co none, z wyjątkiem rozwiązywania konfliktów obramowań dla elementów tabeli.
dotted Określa kropkowaną ramkę.
dashed Określa przerywaną ramkę.
solid Definiuje pełne obramowanie.
double Definiuje podwójne obramowanie.
groove Określa rowkowane obramowanie 3D. Efekt zależy od wartości koloru obramowania.
ridge Określa prążkowaną ramkę 3D. Efekt zależy od wartości koloru obramowania.
inset Określa ramkę 3D. Efekt zależy od wartości koloru obramowania.
outset Określa obramowanie 3D. Efekt zależy od wartości koloru obramowania.
initial Ustawia tę właściwość na jej wartość domyślną.
inherit Dziedziczy tę właściwość z elementu nadrzędnego.

Składnia CSS border-style

border-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset | initial | inherit;

Wsparcie przeglądarek dla właściwości border-style

Liczba w tabeli określa pierwszą wersję przeglądarki w pełni obsługującą tę właściwość.

Właściwość chrome edge firefox safari opera
border-style 1.0 4.0 1.0 1.0 3.5

Uwaga: wartość hidden nie jest obsługiwana w przeglądarce IE7 i starszych. IE8 wymaga !DOCTYPE. Przeglądarki IE9 i nowsze obsługują hidden.

Przykładowe zastosowania z właściwością border-style

Kliknij wartości właściwości poniżej, aby zobaczyć wynik.

Właściwość CSS:
border-style:

 
Rezultat:
 
Kod CSS:
div {
    border-width:5px;  
border-style:none;
}
 

 

Przykłady właściwości border-style

1. border-style: dotted solid double dashed;
górne obramowanie jest rodzaju dotted
prawe obramowanie jest solid
dolne obramowanie jest double
lewe obramowanie jest dashed

2. border-style: dotted solid double;
górne obramowanie jest dotted
prawe i lewe obramowanie jest solid
dolne obramowanie jest double

3. border-style: dotted solid;
górne i dolne obramowanie jest dotted
prawe i lewe obramowanie jest solid

4. border-style: dotted;
wszystkie cztery obramowania są dotted

border-style: dashed;

border-style: groove;

border-style: ridge;

border-style: inset;

border-style: outset;

 

Witold Czuba Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony , , Marynarska 54, 59-220, Legnica, dolnośląskie, Polska, tel. +48 780 060 995, Pon. - pt. 8:00 - 17:00

 

 

Witold Czuba

Tworzenie stron Warszawa, Wrocław i Legnica | Grafik | Strony

Marynarska 54
59-220, Legnica,
dolnośląskie, Polska,
tel. +48 780 060 995,
Pon. - pt. 8:00 - 17:00