先看案例效果演示：
这个也是很简单和常见的侧边栏效果，基础布局一样只需要一个div 加下面的a标记，点击跳转就可以了。这里是一个效果所以链接给一个# 不用跳转就可以了，这个是基础的html 布局部分：
这个里有一个操作就是点击，通常点击是用JS 来做，而CSS3 也和可以点击效果的，通过input 和 label绑定就可以了。
这里注释都写好了，看着这个代码多写多敲几遍 基本都没有多少问题了，点击的实现靠的是 ：checked这个属性，同时适当的用 CSS3得分选择器，就简单许多了。
CSS伸缩导航效果讲解
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。
推荐阅读更多精彩内容
- Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
