更改反應選擇中選定項目的顏色

我想更改反應選擇中選定項目的顏色。目前選定的項目顯示爲藍色。我想改變顏色爲灰色更改反應選擇中選定項目的顏色

爲了這個我做了以下步驟

創建了一個名爲MyComponent.scss

$grey: #999; 
.Select--multi { 
.Select-value { 
    background-color: $grey; 
    color: $grey; 
}}

，然後文件將該文件導入我的組件

import 'react-select/scss/default.scss'; 
import './MyComponent.scss';

我的希望是，這將覆蓋默認顏色與我的$灰色變量。

但顏色仍然是藍色。

來源

2016-02-05 Knows Not Much

改變這種顏色需要一些雜耍的.css，因爲有很多元素必須改變。請記住rgba的第4個數字代表半透明。這裏有需要的要素改變：

div.Select-control>.Select-value { 
background-color: rgba(153, 153, 153, .08); 
border: 1px solid rgba(153, 153, 153, 0.24); 
color: #999; 
} 
div.Select-control>.Select-value>.Select-value-icon { 
border-right: 1px solid rgba(153, 153, 153, 0.24); 
} 
div.Select-control>.Select-value>.Select-value-label, .Select-value>a { 
color: #999; 
}

邁向改變這些因素，我建議使用選擇像我證明，但你也可以使用替代的顏色很重要剛剛符號之後！通常，如果它在.css中存在於同一級別，則最具體的樣式會獲勝。

存在兩個偉大的工具可以做到這一點...首先在Chrome中右鍵單擊該元素並查看您的檢查器（樣式）。其次，一個rgba計算器可在http://hex2rgba.devoth.com/。

PS ......我注意到你在另一個的內部有一個聲明，一般來說，如果我想要做多個選擇我使用。選擇 - 多，。選擇值{不是一個值在.css的另一個括號內，或者我使用>爲子元素。

來源

2016-02-05 15:36:01

更改反應選擇中選定項目的顏色

回答

相關問題