邊框與外框

邊框寬度border-width

Setting the width of an element’s border.

Overview

ClassDeclarations
b:<size>border-width: <size>;
bt:<size>border-top-width: <size>;
bb:<size>border-bottom-width: <size>;
bl:<size>border-left-width: <size>;
br:<size>border-right-width: <size>;
bx:<size>border-inline-width: <size>;
by:<size>border-block-width: <size>;

Examples

Set border width

Use b:* with a size value to set border-width.

<div class="b:1px b-solid">    ...</div>
Generated CSS
@layer utilities {    .b\:1px {        border-width: 1px    }}

Set one side or axis

Use bt:*, br:*, bb:*, and bl:* for physical sides. Use bx:* and by:* for logical axes.

<div class="bt:2px by:1px">...</div>

Use border when width, style, and color should be declared together.

Apply conditionally

Apply styles based on different states using selectors and conditional queries.

<div class="b:0 b:1px@sm b:0@print">...</div>

Remember that a border is not visible unless its style is not none.


  • Master UI


© 2026 Aoyue Design LLC.MIT License
Trademark Policy