简单教程
提交运行
代码编辑器：
<!DOCTYPE htm> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="https://cdn.bootcss.com/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet"> <style>body {margin:10px}</style> <div class="container"> <div class="row"> <div class="span5"> <form class="form-horizontal"> <fieldset> <legend>Bootstrap支持的控件</legend> <div class="control-group"> <label class="control-label" for="input01">焦点输入</label> <div class="controls"> <input type="text" class="input-xlarge" id="input01"> <p class="help-block">除了自由格式文本，一些HTML5基于文本的输入像这样呈现。</p> </div> </div> <div class="control-group"> <label class="control-label" for="input01">只读输入</label> <div class="controls"> <input type="text" class="input-xlarge" id="input01" readonly="true"> <p class="help-block">除了自由格式文本，一些HTML5基于文本的输入像这样呈现。</p> </div> </div> <div class="control-group"> <label class="control-label" for="input01">禁用输入</label> <div class="controls"> <input type="text" class="input-xlarge" id="input01" disabled> <p class="help-block">除了自由格式文本，一些HTML5基于文本的输入像这样呈现。</p> </div> </div> <div class="control-group"> <label class="control-label" for="optionsCheckbox" reado>确认框 (禁用)</label> <div class="controls"> <label class="checkbox"> <input type="checkbox" id="optionsCheckbox" value="option1" disabled> 选中选项，确认此项正确。 </label> </div> </div> <div class="form-actions"> <button type="submit" class="btn btn-primary" disabled>保存修改 (禁用按钮)</button> <button class="btn">取消</button> </div> </fieldset> </form> </div> </div> </div>
运行结果：