Bootstrap form elements


forms


examples/bootstrap/forms.html
<!DOCTYPE html>
<html lang="en">
  <head>
  <meta charset="utf-8">
  <meta name="viewport"
     content="width=device-width, initial-scale=1, user-scalable=yes">
  <link href="css/bootstrap.min.css" rel="stylesheet" />
  <title>Forms</title>
  </head>
  <body>
    <div class="container-fluid">

      <div class="row">
        <div class="col-xs-1"></div>
        <div class="col-xs-10">
        <h1>Form</h1>
        <form>
            <div class="form-group">
               <label for="name">Full Name</label>
               <input type="text" class="form-control" id="name" placeholder="Name">
            </div>
            <div class="form-group">
               <label for="email">Email address</label>
               <input type="email" class="form-control" id="email" placeholder="Email">
            </div>

            <div class="form-group">
                <label>
                   Gender:
                </label>
                <div class="radio-inline">
                  <label>
                    <input type="radio" name="gender" id="gender_ms" value="ms"> Ms
                  </label>
                </div>
                <div class="radio-inline">
                  <label>
                    <input type="radio" name="gender" id="gender_mr" value="mr"> Mr
                  </label>
                </div>
                <div class="radio-inline">
                  <label>
                    <input type="radio" name="gender" id="gender_mx" value="mx"> Mx
                  </label>
                </div>
                <div class="radio-inline">
                  <label>
                    <input type="radio" name="gender" id="gender_alien" value="alien" disabled> Alien
                  </label>
                </div>
            </div>

            <div class="form-group">
                <label for="language" class="col-sm-2 control-label">Language:</label>

                <select id="language" class="form-control">
                  <option value=""></option>
                  <option value="perl">Perl</option>
                  <option value="python">Python</option>
                  <option value="php">PHP</option>
                  <option value="ruby">Ruby</option>
                  <option value="javascript">JavaScript</option>
                </select>
            </div>

            <div class="checkbox">
              <label>
                <input type="checkbox" id="agree" value=""> Agree
              </label>
            </div>
            <button type="submit" class="btn btn-default">Update</button>
        </form>

        </div>
        <div class="col-xs-1"></div>
      </div>

    </div>  
  </body>
</html>