CSS 如何将图像图标添加到 Bootstrap 选择选项
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16576020/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to Add Image Icon to Bootstrap Select Options
提问by dsdsd
Just wonder if it is possible to add Icon/Image to Bootstrap Select Options.
I already tries this by adding background-image to options at HERE
只是想知道是否可以将图标/图像添加到 Bootstrap 选择选项。
我已经通过在此处向选项添加背景图像来尝试此操作
<select class="span2">
<option>1</option>
<option style="background-image:url(slider-dot.png);">2</option>
<option>3</option>
</select>
But it is not working! Can you please let me know if this is possible? Thanks
但它不起作用！你能告诉我这是否可能吗？谢谢
回答by Juan Carlos Alpizar Chinchilla
As far as I know you can't add icons to option elements using built-in bootstrap settings. However, there's a plugin built for bootstrap meant to do this functionality, also adding additional customization options to bootstrap select components. It's called bootstrap-select.
据我所知，您无法使用内置引导程序设置向选项元素添加图标。但是，有一个为引导程序构建的插件旨在执行此功能，还为引导程序选择组件添加了额外的自定义选项。它被称为引导选择。
The icons used for this plugin are directly loaded from the Glyphicons provided by bootstrap.
这个插件使用的图标是直接从 bootstrap 提供的 Glyphicons 加载的。
- The Git Project can be found here: http://silviomoreto.github.io/bootstrap-select/
- You can also find a live demo of the functionality in here: http://silviomoreto.github.io/bootstrap-select/
- Git 项目可以在这里找到：http: //silviomoreto.github.io/bootstrap-select/
- 您还可以在此处找到该功能的现场演示：http: //silviomoreto.github.io/bootstrap-select/
EDIT: see link for jsFiddle example: http://jsfiddle.net/YW8MV/5/
编辑：参见 jsFiddle 示例的链接：http: //jsfiddle.net/YW8MV/5/
The relevant JavaScript is this:
相关的 JavaScript 是这样的：
$('.selectpicker').selectpicker({
style: 'btn-primary',
showIcon: true,
title: 'select test'
});
