為什麼背景顏色不應用於可捲動 Div 中的複選框？-css教學-PHP中文網

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

Susan Sarandon

發布： 2024-11-29 08:42:10

原創

640 人瀏覽過

Why Doesn't Background Color Apply to Checkboxes in a Scrollable Div?

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

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

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

HTML:

<div>

登入後複製

CSS:

.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>

登入後複製

修改後的 CSS：

.listContainer {
    /* Same as before */
}

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

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

.oddRow {
    background-color: #ffffff;
}

登入後複製

以上是為什麼背景顏色不應用於可捲動 Div 中的複選框？的詳細內容。更多資訊請關注PHP中文網其他相關文章！