"Bootstrap Validation States"的中文翻译是"Bootstrap验证状态"

Bootstrap 包括错误、警告和成功消息的验证样式。要使用,只需将适当的类(.has-warning、.has-error 或 .has-success)添加到父元素即可。

示例

您可以尝试运行以下代码用于实现验证状态

实时演示

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>
      <link href = /bootstrap/css/bootstrap.min.css rel = stylesheet>
      <script src = /scripts/jquery.min.js></script>
      <script src = /bootstrap/js/bootstrap.min.js></script>
   </head>
   <body>
      <form class = form-horizontal role = form>
         <div class = form-group>
            <label class = col-sm-2 control-label>Focused</label>
            <div class = col-sm-10>
               <input class = form-control id = focusedInput type = text value = This is focused...>
            </div>
         </div>
         <div class = form-group>
            <label for = inputPassword class = col-sm-2 control-label>Disabled</label>
            <div class = col-sm-10>
               <input class = form-control id = disabledInput type = text placeholder = Disabled input here... disabled>
            </div>
         </div>
         <fieldset disabled>
            <div class = form-group>
               <label for = disabledTextInput class = col-sm-2 control-label>
                  Disabled input (Fieldset disabled)
               </label>
               <div class = col-sm-10>
                  <input type = text id = disabledTextInput class = form-control placeholder = Disabled input>
               </div>
            </div>
            <div class = form-group>
               <label for = disabledSelect class = col-sm-2 control-label>
                  Disabled select menu (Fieldset disabled)
               </label>
               <div class = col-sm-10>
                  <select id = disabledSelect class = form-control>
                     <option>Disabled select</option>
                  </select>
               </div>
            </div>
         </fieldset>
         <div class = form-group has-success>
            <label class = col-sm-2 control-label for = inputSuccess>
               Input with success
            </label>
            <div class = col-sm-10>
               <input type = text class = form-control id = inputSuccess>
            </div>
         </div>
         <div class = form-group has-warning>
            <label class = col-sm-2 control-label for = inputWarning>
               Input with warning
            </label>
            <div class = col-sm-10>
               <input type = text class = form-control id = inputWarning>
            </div>
         </div>
         <div class = form-group has-error>
            <label class = col-sm-2 control-label for = inputError>
               Input with error
            </label>
            <div class = col-sm-10>
               <input type = text class = form-control id = inputError>
            </div>
         </div>
      </form>
   </body>
</html>

以上就是Bootstrap Validation States的中文翻译是Bootstrap验证状态的详细内容,更多请关注双恒网络其它相关文章!

简简单单挺好的

联系我们 订单查询