ruby-on-rails - 物化选择输入显示两个插入符号

Question

我刚刚通过 gem 'materialize-sass' 将 Materialise 集成到我的 Rails 项目中。 .出于某种原因，选择输入显示两个插入符号而不是 1。



选择输入的代码基本上是他们网站上示例的一个分支。

<div class="input-field">
    <select name="tutor_profile[dob_month]" id="tutor_profile_dob_month">
        <option value="" disabled selected>Choose your month</option>
        <option value="1">January</option>
        <option value="2">February</option>
        <option value="3">March</option>
        <option value="4">April</option>
        <option value="5">May</option>
        <option value="6">June</option>
        <option value="7">July</option>
        <option value="8">August</option>
        <option value="9">September</option>
        <option value="10">October</option>
        <option value="11">November</option>
        <option value="12">December</option>
    </select>
    <label>Birthday</label>
</div>

我尝试在开发人员控制台中调整选择按钮的 CSS 样式，但没有成功。选择输入中的任何元素都没有额外的样式。

我使用的其他 CSS 框架是 bootstrap、bootstrap-tagsinput、twitter-typeahead 和 jquery-ui。我想知道是否有人经历过类似的事情。

Answer 1

简短的回答:

将此添加到您的 css

.caret {
  border-color: transparent !important;
}

长答案:

Bootstrap 使用 实现插入符号css 边框(右、上、左)，
和 materializecss 使用文本“▼”作为内部 实现插入符号html 元素的。

强制透明边框将导致 bootstrap 的插入符号消失，并将解决您的问题。

如果你坚持使用 bootstrap 的插入符号，你将不得不编辑 materializecss 的 javascript 文件，这是不推荐的。