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 中国語 Web サイトの他の関連記事を参照してください。