<#def title = "日历控件"/> <#def keyword = "ZhiqimUI"/> <#def desc = "日历控件是在输入框触发时展开一个年月日时分秒的日期界面，按日历格式显示出来，通过点击和选择得到要求的日期或时间。当前日历控件支持选择日期、选择日期+时间、选择日期+时分三种。"/> <#def prevUrl = "calendar.htm"/> <#def nextUrl = "../dialog/dialog.htm"/> ${zhiqim_com_head()} ${zhiqim_com_head_main()} ${zhiqim_com_head_end()} ${zhiqim_com_mobileUI_scrollJs()} ${zhiqim_com_body()} ${zhiqim_com_topnav("ui")}
${zhiqim_com_container_ui("ZmUI", "form", "checkInput")}
${zhiqim_com_breadcrumb("UI", "ZmUI", "表单", "选择按钮")}
<#-- 标题 -->

选中按钮：

选中按钮，包括单选框、多选框、切换按钮；采用 :before 、:after 伪类元素实现，尽可能的减少代码量，而且做到手机上较好的兼容性，因为 input 伪类在桌面端 firefox、edge 不兼容。

<#-- 一、单选框 -->
一、单选框
类型 事例 代码
超小 





    小型
    
    





    默认
    
    





    大型
    
    



    
超大
    
    






<#-- 二、多选框 -->

二、多选框






    类型
    未指定
    代码




    超小
    
    





    小型
    
    





    默认
    
    





    大型
    
    



    
超大
    
    






<#-- 三、切换按钮 -->

三、切换按钮






    类型
    未指定
    代码




    超小
    
    





    小型
    
    





    默认
    
    





    大型
    
    



    
超大
    
    









${zhiqim_turorial_ZmUI_demo_start()}


    
    
ZhiqimUI.mobile





    文案
    文案
    文案
    文案




    
这里是内容



${zhiqim_turorial_ZmUI_demo_end()}





${zhiqim_com_chapter()}








${zhiqim_com_footer()}