twitter-bootstrap 如何在引导程序中使用 html 数据列表?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/48722834/
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 use html datalist with bootstrap?
提问by Anders
Given
给定的
<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
How to apply bootstrap css to this? I would except just to add class="form-control"and it would be layouted in the same fasion as a select element? But that did not work. Is this tag not supported?
如何将引导程序 css 应用于此?我只想添加class="form-control"它并且它会以与选择元素相同的方式进行布局?但这没有用。不支持这个标签吗?
回答by anarchist912
I cannot confirm, that bootstrap 4 does generally not work with the <input>/<datalist>element. Basically you only apply the select field bootstrap classes to the input field, which then get the look of a select/dropdown field with input functionality, e.g.:
我无法确认,bootstrap 4 通常不适用于<input>/<datalist>元素。基本上,您只将选择字段引导类应用于输入字段,然后获得具有输入功能的选择/下拉字段的外观,例如:
<input list="encodings" value="" class="col-sm-6 custom-select custom-select-sm">
<datalist id="encodings">
<option value="ISO-8859-1">ISO-8859-1</option>
<option value="cp1252">ANSI</option>
<option value="utf8">UTF-8</option>
</datalist>
Looks like that on recent Firefox:
在最近的 Firefox 上看起来像这样:
回答by WebDevBooster
Yes, the datalisttag is not supported in Bootstrap 4.
是的,datalistBootstrap 4 不支持该标签。
So, you'd have to add custom css if you want to use that.
所以,如果你想使用它,你必须添加自定义 css。


