一款纯CSS展开收缩的图标导航,点击菜单图标可以展开导航,再次点击菜单图标则自动收缩,图标可以自由增加、替换或删除,喜欢的童鞋请收下吧。
页面的head部分,需远程调用font-awesome图标字体库,并引入本地CSS样式文件,代码如下:
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css'>
<link type="text/css" rel="stylesheet" href="css/style.css">
页面的body部分,多个button按钮放入一个div容器里即可,代码如下:
<div class="wrapper">
<div class="menu">
<input type="checkbox">
<button class="fa fa-pencil"></button>
<button class="fa fa-refresh"></button>
<button class="fa fa-trash"></button>
<button class="fa fa-bars"></button>
</div>
</div>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791