选择器:
checkbox· 设计器组件: 复选框 · 按名称:checkbox#名称或#名称
伪状态: :checked :indeterminate :hover · 子控件: checkbox:indicator(与直接写 indicator-* 等价)
可用属性
| 属性 | 说明 |
|---|---|
color |
文字颜色 |
background-color / border-* / border-radius / show-border |
整卡背景与描边 |
padding-left 等 |
内边距 |
indicator-size / indicator-radius / indicator-spacing |
勾选框大小、圆角、间距 |
indicator-background-color / indicator-border-color |
未选中框底色与边框 |
indicator-checked-background-color |
选中时勾选框填充色 |
checkmark-color |
勾号颜色 |
indicator-checked-image / indicator-unchecked-image |
自定义图片 |
:indeterminate |
三态不确定样式 |
示例
描边卡片(图3 风格)
checkbox#复选框1 {
border-radius: 10;
background-color: #F8F7FC;
border-color: #C8B8FF;
border-width: 2;
show-border: true;
indicator-size: 22;
indicator-radius: 6;
indicator-background-color: #FFFFFF;
indicator-border-color: #C8B8FF;
color: #2A2A30;
}
checkbox#复选框1:checked {
indicator-checked-background-color: #9B6FD0;
indicator-border-color: #9B6FD0;
checkmark-color: #FFFFFF;
}