Syntax
border
Setting an element’s border.
Overview
| Class | Declarations |
|---|---|
b:<size>|`style`|<color> | border: <size>/16rem `style` <color> solid;
|
bt:<size>|`style`|<color> | border-top: <size>/16rem `style` <color> solid;
|
bb:<size>|`style`|<color> | border-bottom: <size>/16rem `style` <color> solid;
|
bl:<size>|`style`|<color> | border-left: <size>/16rem `style` <color> solid;
|
br:<size>|`style`|<color> | border-right: <size>/16rem `style` <color> solid;
|
bx:<size>|`style`|<color> | border-left: <size>/16rem `style` <color> solid;
border-right: <size>/16rem `style` <color> solid;
|
by:<size>|`style`|<color> | border-top: <size>/16rem `style` <color> solid;
border-bottom: <size>/16rem `style` <color> solid;
|
Apply conditionally
Apply styles based on different states using selectors and conditional queries.
<div class="border:1|solid|blue-60:hover border:1|solid|blue-60@sm border:1|solid|blue-60@dark border:1|solid|blue-60@print">…</div>