CSS/HTML雙字體顏色爲SELECT OPTION

我有一個自定義CSS一個小問題，選擇選項/ HTMLCSS/HTML雙字體顏色爲SELECT OPTION

這是我的代碼：

<select id="Month" class="form-styling-date splash_small required" title=" " style="" name="Month" tabindex="12"> 
<option value="1">Janvier</option> 
<option value="2">Février</option> 
.... 
<option value="11">Novembre</option> 
<option value="12">Décembre</option> 
<option value="9999" selected="selected">Mois</option> 
</select>

這是我的CSS代碼：

.form-styling-date { 
    width: 100px; 
    height: 35px; 
    padding-left: 15px; 
    border: none; 
    border-radius: 20px; 
    margin-bottom: 20px; 
    color:#FFF; 
    background: rgba(255,255,255,.2); 
}

你可以看到在這個問題：https://gayurban.com/sync/indexv2.php並選擇報名參加選項進入BIRTHDAY

我自定義CSS以在選擇時在白色中寫入選定的選項，因此當您選擇箭頭查看所有選項時，背景和字體顏色設置爲白色。所以我看不到選項列表。

如何將這種字體顏色更改爲黑色，何時選擇轉爲白色，因爲當我將字體顏色設置爲黑色時，我會看到列表，因此字體顏色變成黑色並不是明顯的選擇。

感謝您的幫助

來源

2015-12-21 LiTHiUM2525

給予風格在你的選擇框 –

@ LiTHiUM2525，最好添加通用樣式標籤選擇，如果你想你的CSS保持同樣通過你的整個網站。並根據類選擇器添加特定樣式，以便在其中更改它。 –

給

.form-styling-date option{color: black;}

在main.css文件在行243

來源

2015-12-21 09:05:11

非常感謝！ – LiTHiUM2525

這個類選擇器不會限制範圍嗎？我的意思是，OP會要求將這個類添加到select（s），他希望添加這個樣式，而不是類型的日期。 –

是的，我把它添加到所有需要的範圍TY – LiTHiUM2525

你應該嘗試：

::-moz-selection { /* Code for Firefox */ 
color: white;} 


::selection { 
color: white;}

更新默認樣式爲黑色:)

來源

2015-12-21 09:00:03

color財產上select將設置選項（S）文本（顏色包括選擇），而在select option上添加/搭配顏色將設置不包括選定選項的選項顏色，該選項將根據爲select指定的值設置。

CSS：

select { 
    color: white; /* color of selected option */ 
} 

select option { 
    color: black; /* color of other options */ 
}

而且，最好添加通用樣式標籤選擇，如果你希望你的組件CSS來通過您的網站保持一致。並添加基於class/id選擇器的特定樣式，以便在其中更改它們。

DEMO

來源

2015-12-21 09:00:49

讓您的選擇爲白色，但然後覆蓋你的選擇選項爲黑色，你的情況：

.form-styling-date option{ 
    color:black; 
}

來源

2015-12-21 09:01:55 trex005

這是您的CSS問題。
在您的頁面上添加這個CSS。因爲這個頁面包含三個選擇所有這些顏色都是白色的。

select option{ 
    color:#000; 
}

來源

2015-12-21 09:01:58

CSS/HTML雙字體顏色爲SELECT OPTION

回答

相關問題