我需要在用户的ui中选择一个Bootstrap 3 glyphicons子集.
我试过这个:
<select class="form-control"> <option><span class="glyphicon glyphicon-cutlery"></span></option> <option><span class="glyphicon glyphicon-eye-open"></span></option> <option><span class="glyphicon glyphicon-heart-empty"></span></option> <option><span class="glyphicon glyphicon-leaf"></span></option> <option><span class="glyphicon glyphicon-music"></span></option> <option><span class="glyphicon glyphicon-send"></span></option> <option><span class="glyphicon glyphicon-star"></span></option> </select>
然而,我得到的都是空行.任何帮助或替代建议赞赏.
解决方法
我认为标准的HTML选择不会显示HTML内容.我建议检查Bootstrap选择:
http://silviomoreto.github.io/bootstrap-select/
<select id="mySelect" data-show-icon="true"> <option data-content="<i class='glyphicon glyphicon-cutlery'></i>">-</option> <option data-subtext="<i class='glyphicon glyphicon-eye-open'></i>"></option> <option data-subtext="<i class='glyphicon glyphicon-heart-empty'></i>"></option> <option data-subtext="<i class='glyphicon glyphicon-leaf'></i>"></option> <option data-subtext="<i class='glyphicon glyphicon-music'></i>"></option> <option data-subtext="<i class='glyphicon glyphicon-send'></i>"></option> <option data-subtext="<i class='glyphicon glyphicon-star'></i>"></option> </select>
这是一个演示:http://bootply.com/86480