Outline-style касиети
outline-style касиети орун ээлемей турган
тышкы рамканын - чек аранын стилин белгилейт.
Синтаксис
тандоочу {
outline-style: маани;
}
Маанилер
| Маани | Сүрөттөмө |
|---|---|
solid |
Туташ сызык. |
dotted |
Чектеш нүктөлөрдөн турган рамка. |
dashed |
Тирелерден турган рамка. |
ridge |
Дөбөчө сызык түрүндөгү рамка. |
double |
Кош сызык түрүндөгү рамка.
Акыркы натыйжаны көрүш үчүн чек аранын калыңдыгы минимум 3px болушу керек.
|
groove |
Ойдуң рамка. |
inset |
Чөгөрүлгөн рамка. |
outset |
Дөбөчө рамка. |
none |
Чек аранын жоктугу. |
Демейки маани: none.
Мисал . Solid мааниси
<div id="elem"></div>
#elem {
outline-width: 1px;
outline-style: solid;
outline-color: black;
width: 300px;
height: 100px;
}
:
Мисал . Dotted мааниси
<div id="elem"></div>
#elem {
outline-width: 1px;
outline-style: dotted;
outline-color: black;
width: 300px;
height: 100px;
}
:
Мисал . Dashed мааниси
<div id="elem"></div>
#elem {
outline-width: 1px;
outline-style: dashed;
outline-color: black;
width: 300px;
height: 100px;
}
:
Мисал . Ridge мааниси
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: ridge;
outline-color: black;
width: 300px;
height: 100px;
}
:
Мисал . Double мааниси
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: double;
outline-color: black;
width: 300px;
height: 100px;
}
:
Мисал . Groove мааниси
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: groove;
outline-color: black;
width: 300px;
height: 100px;
}
:
Мисал . Inset мааниси
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: inset;
outline-color: black;
width: 300px;
height: 100px;
}
:
Мисал . Outset мааниси
<div id="elem"></div>
#elem {
outline-width: 3px;
outline-style: outset;
outline-color: black;
width: 300px;
height: 100px;
}
:
Ошондой эле караңыз
-
рамканын түсүн белгилей турган
outline-colorкасиети,
-
рамканын калыңдыгын белгилей турган
outline-widthкасиети,
-
рамкалар үчүн кыскартылган касиет болгон
outlineкасиети,
-
рамканын жылышын белгилей турган
outline-offsetкасиети,