我想隱藏所有內容，我希望它們在選中時顯示
喜歡在復選框選中時顯示內容
未選中時隱藏，以便當我檢查其他人時他們也會出現
這是我的嘗試，但它不起作用
<style>
#myBike:not(:checked) #bike {
display: block !important;
}
#myCar:not(:checked) #car {
display: block !important;
}
</style>
<input type="checkbox" id="myBike">
<label for="vehicle1"> I have a bike</label><br>
<input type="checkbox" id="myCar">
<label for="vehicle2"> I have a car</label><br>
<div class="row" id="bike">
Something for bike
</div>
<div class="row" id="car">
Something for car
</div>
uj5u.com熱心網友回復：
請檢查下面的代碼。
#bike {
display: none;
}
#myBike:checked~#bike {
display: block;
}
#car {
display: none;
}
#myCar:checked~#car {
display: block;
}<input type="checkbox" id="myBike" />
<label for="vehicle1">I have a bike</label>
<input type="checkbox" id="myCar" />
<label for="vehicle2">I have a car</label>
<div class="row" id="bike">Something for bike</div>
<div class="row" id="car">Something for car</div>說明：
- 您使用了錯誤的語法
~vs - 默認情況下，所有 div 都設定為
display:block. 你應該設定display:none為它的初始值。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/395751.html