<!doctype html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><style type="text/css">ul,li{list-style: none;}*{padding: 0; margin: 0;}.nav-con{display: none;}.nav-box{display: none;}.nav-con:checked ~ .nav-box{display: block;}.nav-btn{padding: 10px 15px;background:red;}</style><body><label for="control" class="nav-btn">菜单</label><div> ???<input type="checkbox" name="" id="control" class="nav-con"> ???<ul class="nav-box"> ???????<li><a href="#">首页</a></li> ???????<li><a href="#">联系我们</a></li> ???????<li><a href="#">产品</a></li> ???????<li><a href="#">新闻</a></li> ???</ul></div></body></html>css---点击显示和隐藏
原文地址：https://www.cnblogs.com/e0yu/p/10480216.html