為什麼背景顏色不應用於可捲動 Div 中的複選框？

div 中復選框的CSS 'background-color' 屬性問題

儘管在CSS 中為複選框設定了'background -color' 屬性在可捲動div 中，不會套用背景顏色修改。但是，其他屬性（例如“margin-top”）可以按預期工作。

用戶提供的HTML 和CSS 代碼如下如下：

HTML:

<div>
<p><strong>CSS:</strong></p> <pre class="brush:php;toolbar:false">.listContainer {
    border:2px solid #ccc;
    width:340px;
    height: 225px;
    overflow-y: scroll;
    margin-top: 20px;
    padding-left: 10px;
}

.oddRow {
    margin-top: 5px;
    background-color: #ffffff;
}

.evenRow{
    margin-top: 5px;
    background-color: #9FFF9D;
}

說明：

出現這個問題是因為複選框本身不支援「背景顏色」屬性。要建立所需的視覺效果，您必須將每個複選框包裝在 div 元素中，並將顏色指派給該 div。

修訂的 HTML：

<div>
<p><strong>修改後的 CSS：</strong></p>
<pre class="brush:php;toolbar:false">.listContainer {
    /* Same as before */
}

.oddRow, .evenRow {
    /* Remove incorrect background-color */
}

.evenRow {
    background-color: #9FFF9D;
}

.oddRow {
    background-color: #ffffff;
}