Bootstrap Tutorial - Bootstrap CheckBox style








CheckBox

<!DOCTYPE HTML>
<html> 
<head> 
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--from   w  w  w.  ja v  a2  s  .  co  m-->
<body style='margin:20px;'>

<form class="form-horizontal">
<div class="checkbox">
  <label>
    <input type="checkbox" value="">
    Option one is this and that&mdash;be sure to include why it's great
  </label>
</div>
</form>
</body>
</html>

Click to view the demo





Inline checkboxes

Use .checkbox-inline or .radio-inline class to a series of checkboxes or radios for controls appear on the same line.

<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
</head><!--  w  ww  .  java 2  s  .  c  o  m-->
<body style='margin: 20px;'>

  <form class="form-horizontal">
    <label class="checkbox-inline"> <input type="checkbox"
      id="inlineCheckbox1" value="option1"> 1
    </label> <label class="checkbox-inline"> <input type="checkbox"
      id="inlineCheckbox2" value="option2"> 2
    </label> <label class="checkbox-inline"> <input type="checkbox"
      id="inlineCheckbox3" value="option3"> 3
    </label>
  </form>

</body>
</html>

Click to view the demo