twitter-bootstrap - 如何在 Bootstrap 中使用 html 数据列表?

标签 twitter-bootstrap bootstrap-4

给定

<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>

如何将 Bootstrap css 应用于此?我会添加 class="form-control"它会以与选择元素相同的方式布局吗?但这没有用。不支持这个标签吗?

最佳答案

我无法确认,bootstrap 4 通常不适用于 <input>/<datalist>元素。基本上你只申请 select字段 Bootstrap 类到 input字段,然后获得具有输入功能的选择/下拉列表的外观,例如:

<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>
在最近的 Firefox 上看起来像这样:
enter image description here

关于twitter-bootstrap - 如何在 Bootstrap 中使用 html 数据列表?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48722834/

相关文章:

html - 此 html 是否无效,受格式影响的 span 元素

javascript - Angular $modal 有什么问题?

twitter-bootstrap - Bootstrap 3 : bootstrap-select and input-group-addon

html - 强制 bootstrap 4 nav-pills 中的第一项在合理时为全宽

javascript - 如何以简单的方式创建数据表?

ruby-on-rails - 如何将 Rails 代码添加到 div 标签中的 id 属性?

jquery - 图片库按钮不会淡出并且图像消失

css - 在响应中隐藏图像?

css - Twitter bootstrap 进度条百分比标签

jquery - Bootstrap(2.3.2) 模态弹出可见性检查