html5桌面侧边栏,HTML5+CSS3实现侧边栏菜单简单实例

HTML5+CSS3实现侧边栏菜单简单实例，点击指定按钮，显示或隐藏侧菜单，CSS3运行于HTML5环境，IE8及以下版本不支持，因此测试时请确认你的浏览器支持HTML5技术，推荐使用火狐或谷歌Chrome浏览器。

无标题文档

*{margin:0; padding:0;}

html{height:100%;}

p{padding:10px 0;}

body{ min-height:100%; font-family:arial; position:relative; }

body.sideMenu{ margin:0; -webkit-transform:none; transform:none; }

#sideToggle{ display:none; }

#sideToggle:checked + aside{ left:0; }

#sideToggle:checked ~ #wrap{ padding-left:220px; }

body > aside{ position:absolute; top:0; bottom:0; left:-200px; width:200px; background:#f1103a; transition:0.2s ease-out; -webkit-transition:0.2s ease-out; }

body > aside > h2{ color:#FFF; text-align:center; font-weight:normal; padding:10px; }

#wrap{margin-left:20px; padding:10px; transition:0.25s ease-out; -webkit-transition:0.25s ease-out; }

#wrap > label{ display:in