bootstrap搭建后台管理页面
2017-11-27 本文已影响54人
丁忠康
管理页面主体包括4部分,顶部导航栏,左侧导航栏,中间正文页和底部的页脚。其中左侧和顶部使用的是bootstrap的导航和下拉菜单组件,主体页面为了演示方便,使用了iframe框架。
接下来简单介绍一下nav组件常见的几种样式
1. 标准标签页
tab页的样式通过外边框线条和内置padding构建出来
下拉菜单组件
下拉菜单依赖单独的插件,我们可以在任何组件(比如导航栏,标签页,胶囊式导航菜单,按钮等)中添加下拉菜单,可以通过单独引用 dropdown.js,或者引用bootstrap.js 或压缩版的 bootstrap.min.js。
它包括2中调用方式,通过data属性或者通过JS直接调用,接下来仅简单介绍通过data属性进行调用的情况。
主要的页面显示代码
以上简单的后台界面姐搭建完成了,具体细节根据实际需要进行调整。