Xüsusiyyət outline-style
Xüsusiyyət outline-style xarici çərçivənin -
yer tutmayan sərhədin stilini təyin edir.
Sintaksis
selektor {
outline-style: qiymet;
}
Qiymetler
| Qiymet | Təsvir |
|---|---|
solid |
Davamlı xətt. |
dotted |
Nöqteler şəklində çərçivə. |
dashed |
Tire şəklində çərçivə. |
ridge |
Qabarıq xətt şəklində çərçivə. |
double |
İkiqat xətt şəklində çərçivə.
Effekti görmək üçün çərçivənin qalınlığı ən azı 3px olmalıdır.
|
groove |
Oyuq çərçivə. |
inset |
Batmış çərçivə. |
outset |
Qabarıq çərçivə. |
none |
Çərçivənin olmaması. |
Standart qiymet: none.
Nümunə . Solid qiymeti
<div id="elem"></div>
#elem {
outline-width: 1px;
outline-style: solid;
outline-color: black;
width: 300px;
height: 100px;
}
:
Nümunə . Dotted qiymeti
<div id="elem"></div>
#elem {
outline-width: 1px;
outline-style: dotted;
outline-color: black;
width: 300px;
height: 100px;
}
:
Nümunə . Dashed qiymeti
<div id="elem"></div>
#elem {
outline-width: 1px;
outline-style: dashed;
outline-color: black;
width: 300px;
height: 100px;
}
:
Nümunə . Ridge qiymeti
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: ridge;
outline-color: black;
width: 300px;
height: 100px;
}
:
Nümunə . Double qiymeti
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: double;
outline-color: black;
width: 300px;
height: 100px;
}
:
Nümunə . Groove qiymeti
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: groove;
outline-color: black;
width: 300px;
height: 100px;
}
:
Nümunə . Inset qiymeti
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: inset;
outline-color: black;
width: 300px;
height: 100px;
}
:
Nümunə . Outset qiymeti
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: outset;
outline-color: black;
width: 300px;
height: 100px;
}
:
Həmçinin bax
-
outline-colorxüsusiyyəti,
çərçivənin rəngini təyin edir -
outline-widthxüsusiyyəti,
çərçivənin qalınlığını təyin edir -
outlinexüsusiyyəti,
çərçivələr üçün qısaldılmış xüsusiyyətdir -
outline-offsetxüsusiyyəti,
çərçivənin yerdəyişməsini təyin edir