边框与圆角

Kraken 支持以下边框与圆角的相关样式。

边框

border

• 定义：设定元素的边框，为 border-width, border-style 和 border-color 属性的简写。
• 属性值： border-width | border-style | border-color
• 参考：链接。

border-width

• 定义：设定元素的边框宽度，为 border-top-width, border-right-width, border-bottom-width, 和 border-left-width 属性的简写。
• 属性值： border-top-width | border-right-width | border-bottom-width | border-left-width
• 参考：链接。

border-*-width

• 定义：设定元素单边的边框宽度。
• 属性值：\[ px | rpx | vw | vh ]
• 参考：链接。

border-color

• 定义：设定元素的边框颜色，为 border-top-color, border-right-color, border-bottom-color, 和 border-left-color 属性的简写。
• 属性值： border-top-color | border-right-color | border-bottom-color | border-left-color
• 参考：链接。

border-*-color

• 定义：设定元素单边的边框颜色。
• 属性值：[ 颜色值 | transparent | 颜色关键词 ]
• 参考：链接。

border-style

• 定义：设定元素的边框颜色，为 border-top-style, border-right-style, border-bottom-style, 和 border-left-style 属性的简写。
• 属性值：border-top-style | border-right-style | border-bottom-style | border-left-style
• 参考：链接。

border-*-style

• 定义：设定元素单边的边框样式。
• 属性值：[ none | solid ]
• 参考：链接。
• 说明：目前仅支持 solid 类型，dotted, dashed 等均不支持

圆角

border-radius

• 定义：设定元素的边框圆角，为 border-top-left-radius,border-top-right-radius, border-bottom-left-radius 和 border-bottom-right-radius 属性的简写。
• 属性值：border-top-left-radius | border-top-right-radius | border-bottom-left-radius | border-bottom-right-radius
• 参考：链接。
• 说明：目前设置 border-radius 时必须保证四个方向的 border 相同，否则 border-radius 不生效。

border-*-radius

• 定义：设定元素的单个方向的边框圆角。
• 属性值：\[ px | rpx | vw | vh | vmin | vmax | rem | em | % ]
• 参考：链接。