自定义Bootstrap复选框

它看起来像什么:

我想用Bootstrap样式看起来像什么:

由于Bootstrap 3没有复选框样式,我发现自定义制作的 Bootstrap风格非常好.

.checkbox label:after {
  content: '';
  display: table;
  clear: both;
}

.checkbox .cr {
  position: relative;
  display: inline-block;
  border: 1px solid #a9a9a9;
  border-radius: .25em;
  width: 1.3em;
  height: 1.3em;
  float: left;
  margin-right: .5em;
}

.checkbox .cr .cr-icon {
  position: absolute;
  font-size: .8em;
  line-height: 0;
  top: 50%;
  left: 15%;
}

.checkbox label input[type="checkbox"] {
  display: none;
}

.checkbox label input[type="checkbox"]+.cr>.cr-icon {
  opacity: 0;
}

.checkbox label input[type="checkbox"]:checked+.cr>.cr-icon {
  opacity: 1;
}

.checkbox label input[type="checkbox"]:disabled+.cr {
  opacity: .5;
}

  
   
   
   Option one
   




  
   
   
   Option two is checked by default
   




  
   
   
   Option three is disabled
   

  
  
  Check this custom checkbox




  
    
    
    Remember me