2,改变导航背景颜色,设置为黑色。给导航标签设置背景颜色为黑色,代码为<代码>背景:# 000>
3,改变导航选中栏目颜色,如“首页“设置为背景为红色。改变类名积极为newactive,并设置其背景颜色为红色。
4,改变“菜单”下的二级栏目,鼠标放上去的颜色。设置类名为<代码>下拉菜单>
5,改变点击“菜单”,弹出二级栏目时的颜色。css代码是。<代码>navbar-default .navbar-nav>.open>:焦点{颜色:黑色,背景颜色:红色}>
6,改变导航栏默认文字的颜色。设置类名navbar-default下面一个标签的文字颜色为白色,代码是。<代码>navbar-default .navbar-nav>li>{颜色:# fff}。
有两种思路。解决第一种：通过判断当前的页面的分类ID和每个菜单的ID进行对比，哪个菜单的ID等于当前页面的分类ID。。那么给其添加一个CLASS让其样式发生变化。。这种方法需要PHP ASP .NET等WEB服务器脚本辅助实现。
第二种：就是通过纯CSS实现。。简单点说就是给每个菜单进点击进入的页面的body元素各添加一个class.然后通过CSS层叠样式表定义其页面击后的效果。示例如下
如果是产品介绍的页面那么body元素添加一个样式<body class=“product”>
介绍页面呢给body元素再添加另一个样式<body class='about'>
其他页面以此类推
然后在样式表中这样定义点击后的页面的样式
/*定义菜单的初始样式*/
.menu li a{display:blockwidth:80pxheight:30pxbackground:greenfloat:left}
/*定义当前页面对应的菜单样式*/
body.product .menu li a,body.about .menu li a{display:blockwidth:100%height:100%background:red}
这样你进入产品介绍 和 公司介绍页面之后对应的CSS生效对应的菜单背景颜色会变红。。点进去变红。其他菜单还是初始样式。。
其实第二种比较麻烦。因为分别定义body加class那部分。。或者你用服务器脚本动态生成lclass 。也行。。但相比第一种还是麻烦了许多。
如果对您有帮助。还望采纳。谢谢。
