Question

我正在研究一种可以帮助用户轻松选择语言的选择。我遇到了https://github.com/lipis/flag-icon-css的问题，要为每个选项添加一个标志。请帮忙。

我添加了css并在一个没有选择内容的简单元素中进行了测试，但它却显示出来，但是在选项内部却无法正常工作，我尝试了数据内容也无法正常工作。

<select class="form-control">
   <option value="HU_hu" data-content='<span class="flag-icon flag-icon-hu"></span>'></option>
   <option value="EN_en" data-content='<span class="flag-icon flag-icon-hu"></span>'></option>
   <option value="DE_de" data-content='<span class="flag-icon flag-icon-hu"></span>'></option>
   <option value="RU_ru" data-content='<span class="flag-icon flag-icon-hu"></span>'></option>
</select>

Answer 1

这取决于您要支持的浏览器以及您对这些标志的期望程度。以我的经验，使用div自己构建“ select like”形式比较容易，然后在select元素上获取图像或与此相关的任何样式。但是，如果您坚持使用select元素，那么可以看看this question.

如何添加跨度以选择选项元素以在每个选项中显示标志？

1 个答案: