#border-style

#Introduction

Used to set the styles of all four borders. This property can define the styles for the top, right, bottom, and left borders in order.

#Usage Examples

css-apisrc/border-style/App.tsx

Code

Preview

#Syntax

border-style: double solid dotted dashed;

#Values

• none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset
• Supports 1-4 value syntax (top → right → bottom → left).

#Formal Definition

#Formal Syntax

border-style = [ <line-style> ]{1,4}
<line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset

#Differences from the Web

• MDN Reference
• Default value is different (Web default is none).
• When the value is none or hidden, the border width remains unchanged (Web sets it to 0).
• Does not support inherit, initial, revert, or unset global values.

#Compatibility