스크롤 가능한 Div 내부의 체크박스에서 '배경색'이 작동하지 않는 이유는 무엇입니까?

내 체크박스에서 CSS "배경색" 속성이 작동하지 않습니다. 문의에서 강조된 문제는 스크롤 가능한 div 내에 포함된 체크박스에 영향을 주는 "배경색" 속성입니다. "margin-top"과 같은 속성은 예상대로 작동하지만 "배경색"은 여전히 ​​유효하지 않습니다.

이 동작을 이해하려면 확인란이 상위 요소에서 배경색을 상속한다는 점에 유의하는 것이 중요합니다. 기본적으로 확인란의 기본 배경색은 브라우저의 스타일에 따라 다릅니다. 따라서 체크박스 자체의 배경색을 직접 설정하는 것은 불가능합니다.

원하는 효과를 제공하려면 원하는 배경색이 있는 div 요소 내에 각 체크박스를 래핑하여 다른 접근 방식을 취할 수 있습니다. 이런 식으로 div 요소는 확인란을 보유하고 배경색 설정을 위한 프록시 역할을 합니다. 예:

<div class="evenRow">
    <input type="checkbox" />
</div>
<div class="oddRow">
    <input type="checkbox" />
</div>
<div class="evenRow">
    <input type="checkbox" />
</div>
<div class="oddRow">
    <input type="checkbox" />
</div>

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

.oddRow {
    background-color: #ffffff;
}

위 내용은 스크롤 가능한 Div 내부의 체크박스에서 '배경색'이 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.