通過檢查選擇器隱藏前一個元素

Question

我想使用css3功能隱藏前一個元素。

基本上，

我想用一個複選框來隱藏以前的兄弟元素，而不使用JavaScript。

我準備了一個入口點的示例。

http://cssdesk.com/5zccy

感謝

編輯：

• 我已經改變了樣品。
• 我的用例：我想在我的網站上有可摺疊的部分。兩個區域由一個簡單的複選框隔開並檢查它將美妙地隱藏以前的兄弟。

我相信，使用純CSS將讓我減少使用JavaScript來完成此任務。

Answer 1

您不能隱藏以前的元素 - 只是下面的人與general sibling selector

DEMO

這時，你可能能夠定位元素，因此在實際頁面上覆選框將出現在.parent div之後。

Answer 2

沒有css選擇器可以選擇匹配元素的上一個標籤。你可以開始使用最接近的只有CSS它在做什麼，在未來的元素：

<input class="hider" type="checkbox" /> child 
<div class="parent"> 
    Parent 
</div>​ 

.hider:checked + * { 
    display:none; 
}​