フォームボックスをチェックしたりチェックを外したりして、アイテムを表示/非表示することができます。これはCSSでのみ行うことができますか？

Question

ony cssを使用してアイテムを表示または非表示にすることはできますか？フォームボックスのチェックやチェックを外すことによって、表示されたり表示されたりするものがありますか？

または、そのためにjavascriptが必要ですか？

あなたの洞察に感謝します！

Answer 1

を参照してください。隣接する兄弟 "セレクタ（+）とchecked疑似クラス。ここ

HTML

<label>Box 1: <input type="checkbox"><span>Box 1 is checked.</span></label> 
<label>Box 2: <input type="checkbox"><span>Box 2 is checked.</span></label> 
<label>Box 3: <input type="checkbox"><span>Box 3 is checked.</span></label> 

CSS

​label {display:block;} 
input[type="checkbox"] + * {display:none; margin-left:1em;} 
input[type="checkbox"]:checked + * {display:inline;} 

デモ：http://jsfiddle.net/LSF3C/

Answer 2

AFAIKを使用すると、JSを介してCSSプロパティを使用してアイテムを表示/非表示できます。
Jsを使用して 'display'プロパティを変更するようにします。

Answer 3

これは、これらの線に沿って、特定の状況下で行うことができます

CSS：

input[type="checkbox"]:checked+div{ display:none; }​ 

HTML：

<input type="checkbox">hide it</input><div>show me</div> 

を」を使用して、はいjs fiddle example