Welink ui组件介绍Checkbox
【摘要】 Checkbox多选按钮。Checkbox UI 提供与WeLink规范一致的视图。 <div class="weui-cells__title">样例1</div> <div class="weui-cells weui-cells_checkbox"> <label class="weui-cell weui-cell-list weui-check__labe...
Checkbox
多选按钮。Checkbox UI 提供与WeLink规范一致的视图。
<div class="weui-cells__title">样例1</div>
<div class="weui-cells weui-cells_checkbox">
<label class="weui-cell weui-cell-list weui-check__label" for="s11">
<div class="weui-cell__hd">
<input type="checkbox" class="weui-check" name="checkbox1" id="s11" checked="checked" />
<i class="weui-icon-checked"></i>
</div>
<div class="weui-cell__bd">
<p>主文体</p>
</div>
</label>
<label class="weui-cell weui-cell-list weui-check__label" for="s12">
<div class="weui-cell__hd">
<input type="checkbox" name="checkbox1" class="weui-check" id="s12"/>
<i class="weui-icon-checked"></i>
</div>
<div class="weui-cell__bd">
<p>主文体</p>
</div>
</label>
</div>
<div class="weui-cells weui-cells_checkbox">
<label class="weui-cell weui-cell-list weui-check__label" for="s13">
<div class="weui-cell__hd">
<input type="checkbox" class="weui-check" name="checkbox2" id="s13" />
<i class="weui-icon-checked"></i>
</div>
<div class="weui-cell__bd">
<p>主文体</p>
<div class="weui-cell__explan">
此处是辅助说明文体，说明文本
</div>
</div>
</label>
<label class="weui-cell weui-cell-list weui-check__label" for="s14">
<div class="weui-cell__hd">
<input type="checkbox" name="checkbox2" class="weui-check" id="s14" checked="checked" />
<i class="weui-icon-checked"></i>
</div>
<div class="weui-cell__bd">
<p>主文体</p>
<div class="weui-cell__explan">
此处是辅助说明文体，说明文本
</div>
</div>
</label>
</div>
<div class="weui-cells__title">样例2</div>
<div class="weui-cells weui-cells_checkbox2">
<label class="weui-cell weui-cell-list weui-check__label">
<div class="weui-cell__hd">
<input type="checkbox" class="weui-check" name="checkbox3" checked="checked"/>
<i class="weui-checkbox2-checked"></i>
</div>
<div class="weui-cell__bd">
<p>A、非常喜欢</p>
</div>
</label>
<label class="weui-cell weui-cell-list weui-check__label">
<div class="weui-cell__hd">
<input type="checkbox" name="checkbox3" class="weui-check" />
<i class="weui-checkbox2-checked"></i>
</div>
<div class="weui-cell__bd">
<p>B、喜欢</p>
</div>
</label>
<label class="weui-cell weui-cell-list weui-check__label">
<div class="weui-cell__hd">
<input type="checkbox" name="checkbox3" class="weui-check" />
<i class="weui-checkbox2-checked"></i>
</div>
<div class="weui-cell__bd">
<p>C、一般</p>
</div>
</label>
<label class="weui-cell weui-cell-list weui-check__label">
<div class="weui-cell__hd">
<input type="checkbox" name="checkbox3" class="weui-check" />
<i class="weui-checkbox2-checked"></i>
</div>
<div class="weui-cell__bd">
<p>D、不喜欢</p>
</div>
</label>
</div>
【版权声明】本文为华为云社区用户原创内容，未经允许不得转载，如需转载请自行联系原作者进行授权。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
作者其他文章
评论（0）