border
Имовина је скраћеница синтакса у ЦСС-у да прихвата више вредности за цртање линије око елемента се примењује у.
.box ( border: 3px solid red; height: 200px; width: 200px; )
Вредности
border
Имовине прихвата један или више од следећих вредности у комбинацији:
border: || ||
border-width
: Одређује дебљину обруба.: Нумеричка вредност мери у
px
,em
,rem
,vh
иvw
јединица.thin
: Еквивалент од1px
medium
: Еквивалент од3px
thick
: Еквивалент од5px
border-style
: Одређује врсту линије повучене око елемента, укључујући:solid
: Пуна, непрекидна линија.none
(подразумевано): Није повучена линија.hidden
: Повучена је линија, али није видљива. ово може бити корисно за додавање мало додатне ширине елементу без приказивања обруба.dashed
: Линија која се састоји од цртица.dotted
: Линија која се састоји од тачака.double
: Око елемента су нацртане две линије.groove
: Додаје стопу на основу вредности боје на начин да чини да елемент изгледа утиснут у документ.ridge
: Сличноgroove
, али преокреће вредности боја на начин да чини да елемент изгледа подигнут.inset
: Додаје раздвојени тон линији због које елемент изгледа помало депресивно.outset
: Сличноinset
, али преокреће боје на начин да елемент изгледа лагано подигнут.
color
: Одређује боју обруба и прихвата,
, ,
,
,
,
currentcolor
and
Phew, that’s a lot of values for one little ol’ property! Here’s a demo that illustrates the differences between all of those style values:
See the Pen CSS border by Geoff Graham (@geoffgraham) on CodePen.
Browser Support
You can count on excellent support for the
border
property across all browsers.
Хром | Сафари | Фирефок | Опера | ИЕ | Андроид | иОС |
---|---|---|---|---|---|---|
Било који | Било који | Било који | 3.5+ | 4+ | Било који | Било који |
Related Properties
What we covered here is specific to the
border
property, but there are other properties that provide even more options for styling borders.
border-collapse
: Specifies the spacing between borders on theborder-image
: Allows the use of an image to draw the border instead of a solid color.border-radius
: Provides control for rounded corners.- CSS Backgrounds and Borders Module Level 3 Specification
- Understanding border-image
- A Tale of Border Gradients
More Information
More Information
element. #####