100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > HTML5+CSS3小实例:后台管理系统的侧边导航栏

HTML5+CSS3小实例:后台管理系统的侧边导航栏

时间:2021-05-02 20:00:31

相关推荐

HTML5+CSS3小实例:后台管理系统的侧边导航栏

HTML5+CSS3做一个后台管理系统的侧边导航栏,点击三条杠,可以收起或展开侧边导航栏。收起时,图标变大,文本在图标下方,管理员头像右侧的欢迎语隐藏;展开时图标变小,文本在图标的右侧显示,管理员头像右侧的欢迎语显示。切换过程伴有过渡动画,右侧内容区可以放自己的内容。

效果:

源码:

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><title>侧边展开导航栏</title><!-- 引入字体图标 --><link rel="stylesheet" href="/font-awesome/4.7.0/css/font-awesome.css">

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。