css - Twitter Bootstrap 单选/复选框 - 如何放置字形图标

Question

使用 TB，是否可以设置单选框或复选框的样式，使其显示字形而不是单选框或复选框的默认样式？我想使用 glyphicon glyphicon-star 表示未选中，然后使用 glyphicon glyphicon-star-empty 表示选中。

Answer 1

如果没有 javascript，您可以修改样式...在我看来这有点像 hack，但它很有趣，因为我意识到 boostrap 使用图标字体 #newb。

HTML

<input type="checkbox" class="glyphicon glyphicon-star-empty" >

CSS

.glyphicon:before {
     visibility: visible;
}
.glyphicon.glyphicon-star-empty:checked:before {
    content: "\e006";
}
input[type=checkbox].glyphicon{
     visibility: hidden;        
}

试一试 HERE