简单教程
提交运行
代码编辑器:
<!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>表单验证错误,警告或成功</legend> <div class="control-group error"> <label class="control-label" for="inputError">输入错误</label> <div class="controls"> <input type="text" id="inputError"> <span class="help-inline">请纠正错误</span> </div> </div> <div class="control-group warning"> <label class="control-label" for="inputWarning">输入警告</label> <div class="controls"> <input type="text" id="inputWarning"> <span class="help-inline">出现一些错误</span> </div> </div> <div class="control-group success"> <label class="control-label" for="inputSuccess">成功输入</label> <div class="controls"> <input type="text" id="inputSuccess"> <span class="help-inline">成功输入</span> </div> </div> <div class="control-group success"> <label class="control-label" for="selectError">选择成功</label> <div class="controls"> <select id="selectError"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select> <span class="help-inline">选择成功</span> </div> </div> </fieldset> </form> </div> </div> </div> <script src="/static/lib/bootstrap/2.3.2/docs/assets/js/jquery.js"></script> <script src="/static/lib/bootstrap/2.3.2/docs/assets/js/bootstrap.min.js"></script>
运行结果: