簡體   English   中英

當選中div中的復選框時,如何在CSS中回溯以嘗試更改div顏色?

[英]How to back-trace in CSS trying to change div color when checkbox inside div is checked?

我有一個帶有一個復選框的div ,我試圖在選中復選框時更改div顏色-僅使用HTML CSS而不使用JavaScript取消選中。 但是由於CSS不支持回溯,所以我不確定如何實現。

CSS:

.content {
  height: 50px;
  width:50px;
  border: 1px solid black;
}

HTML:

<div class="content">
  <input type="checkbox">
</div>

我已經將checkboxspan包裹在label ,然后在下面添加了CSS:

 label { height: 50px; width: 50px; border: 1px solid black; display: inline-block; position: relative; } .content { display: inline-block; position: absolute; height: 100%; width: 100%; top: 0; z-index: -1; left: 0; } input:checked+span { background-color: red } 
 <label for="check"> <input type="checkbox"> <span class="content"> </span> </label> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM