网页中精美下拉框的制作

由于在项目中要用到下拉框，但是通过Bootstrap w3c上看到的下拉框的制作比较简单，效果不是很好，所以就上网去找bootstrap下拉框的插件，经过实验比对Bootstrap-select效果比较好，现把自己的制作过程写下来：

1.下载bootstrap-select的.zip或者是.tar.gz文件，由于我用的是Nodejs的Web框架Express所以就把下载下来的文件中的bootstrap-select.min.js放到了public下的javascripts文件中，bootstrap-select.min.css放到了stylesheets文件夹中，作为本地文件来使用;

2.使用其代码如下：

<select name="browser" class="selectpicker" data-style="btn-primary">
                 <option value="volvo">Volvo</option>
                 <option value="bmw">Saab</option>
                 <option value="audi">Audi</option>
 </select>

效果如下：

3.尝试其他效果通过 data-style attribute:

<select class="selectpicker" data-style="btn-primary">
...
</select>
 
<select class="selectpicker" data-style="btn-info">
...
</select>
 
<select class="selectpicker" data-style="btn-success">
...
</select>
 
<select class="selectpicker" data-style="btn-warning">
...
</select>
 
<select class="selectpicker" data-style="btn-danger">
...
</select>
 
<select class="selectpicker" data-style="btn-inverse">
...
</select>

效果如下：