checkbox 和radio
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<link rel="stylesheet" type="text/css" href="../jquery.mobile-1.4.5.min.css" rel="external nofollow" >
<script type="text/javascript" src="../jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="../jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>hello</h1>
</div>
<div data-role="content">
<label>
<input type="checkbox" >
<!-- 将复选框放在label当中使内容和复选框同行显示，而不重叠 -->
苹果<!-- 复选框 -->
</label>
<fieldset data-role="controlgroup"><!-- date-role="controlgroup" -->
<!-- date-role="controlgro"将内容放在一组内进行显示 -->
<label>
<input type="checkbox" name="cb0">12
</label>
<label>
<input type="checkbox" name="cb1">12
</label>
<label>
<input type="checkbox" name="cb1">12
</label>
</fieldset>
<fieldset data-role="controlgroup" data-type="horizontal">
<!-- 默认为竖向，若需要改成横向，加上data-type="horizontal" -->
<label>
<input type="checkbox" name="cb0">12
</label>
<label>
<input type="checkbox" name="cb1">12
</label>
<label>
<input type="checkbox" name="cb1">12
</label>
</fieldset>
<!-- 单选按钮 -->
<fieldset data-role="controlgroup" data-type="horizontal">
<!-- data-role="controlgroup"形成列表组 data-type="horizontal"形成横向的列表组-->
<label>
<input type="radio" name="r1" id="name">男</label>
<label>
<input type="radio" name="r1" id="women">女
</label>
</fieldset>
</div>
<div data-role="footer">
<h1>welcome</h1>
</div>
</div>
</body>
</html>
显示效果
aaarticlea/png;base64,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” alt=”” />
