2017-01-26 126 views
0

我需要做引導glyphicon複選框引導glyphicon複選框CSS

<label class="checkbox-inline"><input type="checkbox" value=""/> 
    To Download<div class="glyphicon glyphicon-download"></div> 
</label> 

但是我希望把glyphicon到地方複選框。在此先感謝答案

+0

http://jsfiddle.net/t7gAR/579/ –

回答

1

試試這個它會運行

工作的代碼片斷

.glyphicon:before { 
 
visibility: visible; 
 
} 
 
.glyphicon.glyphicon-download:checked:before { 
 
    content: "\e013"; 
 
} 
 
input[type=checkbox].glyphicon{ 
 
    visibility: hidden; 
 
    
 
}
<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
<meta charset="utf-8"> 
 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
 

 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
      <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 

 

 

 
</head> 
 
<body> 
 
<label class="checkbox-inline"><input type="checkbox" class="glyphicon glyphicon-download" value=""/> 
 
    To Download 
 
</label> 
 
</body> 
 
</html>