响应式开发 纯CSS实现隐藏菜单栏

// 将要隐藏的菜单设置 display: block;

// 然后在菜单上面设置一个点击选项，如“菜单”
<label for="toggle-checkbox" id="toggle-label">菜单</label>

<input type="checkbox" id="toggle-checkbox">
<div>需要被隐藏的菜单<div>
// 在css中设置： 
#toggle-checkbox:checked ~ div { display: block; } 
#toggle-checkbox {display: none;}

这样就实现了只要点击菜单，就能够隐藏跟在他后面的 div，利用了 label 能通过 for 属性来关联 input id 的特性