bootstrap打造一个左侧折叠菜单的系统模板(一)

《bootstrap打造一个左侧折叠菜单的系统模板(一)》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

1、Bootstrap打造一个左侧折叠菜单的系统模板这篇文章主要介绍了Bootstrap打造一个左侧折叠菜单的系统模板（一）的相关资料，需要的朋友可以参考下1•刖g最近需要做一个后台管理系统，我打算使用bootstrap弄一个好看的后台模板。网上的好多模板我觉的css和js有点重。于是就打算完全依靠bootstrap搭建一个属于自己的模板。首先从左侧的折叠菜单开始。看图。2.CSS代码以下是自定义的css代码，由于系统是内部使用，所以优先考虑chrome,firefox不考虑IE了。#main-nav{mar

2、gin-left:lpx;}#main-nav.nav-tabs,nav-stackedgt;1igt;a{padding:10px8px;font-size:12px;font-weight:600;color:#4A515B:background:#E9E9E9:background:-moz-1inear-gradient(top,ttFAFAFAO%,#E9E9E9100%):background:~webkit-gradient(linear,lefttop,leftbottom,color-s

3、top(0%,#FAFAFA),color-stop(100%,#E9E9E9)):background:-webkit-linear-gradient(top,#FAFAFAO%,#E9E9E9100%):background:-o~linear-gradient(top,#FAFAFA0%,#E9E9E9100%):background:-ms-linear-gradient(top,ttFAFAFAO%,#E9E9E9100%);background:linear-gradient(top,#FAF

4、AFA0%，#E9E9E9100%);fiIter:progid:DXImageTransform.Mierosoft.gradient(startColorstr=，#FAFAFA’，endColorstr=’#E9E9E9’)；-ms-filter:〃progid:DXImageTransform.Microsoft,gradient(startColorstr二’#FAFAFA’，endColorstr=#E9E9E9’)"；border:lpxsolid#D5D5D5;border-radius:

5、4px:#main-nav.nav-tabs.nav-stackedgt;ligt;agt;span{color:#4A515B;#main-nav.nav-tabs.nav-stackedgt;li.activegt;a,ftnain-nav.nav-tabs.nav-stackedgt:ligt:a:hover{color:#FFF:background:#3C4049;background：-moz-linear-gradient(top,#4A515B0%,#3C4049100%):backgro

6、und:-webkit-gradient(linear,lefttop,leftbottom,color-stop(0%,#4A515B),color-stop(100%,#3C4049)):background:-webkit-linear-gradient(top,#4A515B0%,#3C4049100%):background:-o_linear-gradient(top,#4A515B0%,#3C4049100%);background:~ms-linear-gradient(top,#4A51

7、5B0%,#3C4049100%);background:linear-gradient(top,#4A515B0%,#3C4049100%):fliter:progid:DXImageTransform.Microsoft.gradient(startColorstr=’#4A515B’，endColorstr-#3C4049’)；-ms-filter:"progid:DXImageTransform.Mierosoft.gradient(startColorstr=’#4A515B’，endColor

8、str=’#3C4049’)〃；border-color:#2B2E33:#main-nav.nav-tabs.nav-stackedgt:li.activegt;a,#main-nav.nav-tabs.nav-stackedgt:ligt;a:hovergt;span{color:#FFF:#main-nav.nav-tabs.nav-stackedgt;li{margin-bottom:4px;}/*定义二级菜单样式*/