2016-12-16 152 views
-2

我的HTML是這樣如何風格選擇單選按鈕

<div class="col-md-12 money-radio-container"> 
    <input type="radio" name="optradio" class="money-radio" value="10">10 <span>$</span> 
    <input type="radio" name="optradio" class="money-radio" value="20">20 <span>$</span> 
    <input type="radio" name="optradio" class="money-radio" value="50">50 <span>$</span> 
</div> 

現在我想給它選擇日益單選按鈕紅色。我怎樣才能通過CSS實現這一點?

注意:您可能已經注意到當我單擊每個單選按鈕時,不會發生html更改。所以我不知道如何識別選定的一個。 小提琴:https://jsfiddle.net/rrmzvkag/3/

+0

你或許應該看看':checked' –

+0

@AndyHolmes我已經嘗試過在這裏。但不工作https://jsfiddle.net/rrmzvkag/3/ – Athul

+0

這是因爲它不是'type =「checked」'。它是'input [type =「radio」]:checked' –

回答

2

的CSS規則是

input[type="radio"]:checked 

不確定你想做的事,但到底是什麼,如果你正準備做這在你的問題每個無線電元素之後而來的元素上的一些樣式你倒是使用以下規則

input[type="radio"]:checked + span 
+0

我已經在這裏試過了。但不能正常工作 https://jsfiddle.net/rrmzvkag/2/ – Athul

+0

你能給我發送正確分辨率的更新小提琴嗎? – Athul

+0

你甚至沒有寫我在答案中提供的CSS。耶穌。 –