改變顏色和樣式的rails的bootstrap和select2實現的collection_select下拉列表

Question

我想改變顏色和風格的軌道下拉，以匹配我的網站應用程序樣式的其餘部分。我正在使用Rails，Bootstrap和select2，我不知道在哪裏添加css以及如何開始訪問下拉菜單的不同部分，以便我可以爲它們着色並使它們適用於應用程序的其餘設計。

這是下拉

<%= collection_select(:id, :name, @product, :id, :name,{:include_blank => true},{class: "js-example-basic-single" }) %> 

執行請告訴我如何完成造型此項目，謝謝。

Answer 1

我不確定你的問題是什麼，所以我會盡我所能地盡力回答。我相信你應該把你的CSS添加到應用在app \ assets \ stylesheets下的application.css文件中。然後，如果你想自定義所有的下拉菜單，你可以在css中使用select標籤。下面是一個例子

select { 
 
    position: relative; 
 
    display: inline-block; 
 
    cursor: pointer; 
 
    text-align: center; 
 
    text-decoration: none; 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    border-radius: 3px; 
 
    border: none; 
 
    background: #f1f1f1; 
 
    padding: 2px; 
 
} 
 
    
 
select:hover { 
 
    background-color: dodgerblue; 
 
}

<select> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="mercedes">Mercedes</option> 
 
    <option value="audi">Audi</option> 
 
</select>