当前位置:首页 > CMS教程 > WordPress > 列表

wordpress导航菜单的当前菜单高亮显示与添加分隔符例子

发布:smiling 来源: PHP粉丝网  添加日期:2015-05-07 16:03:04 浏览: 评论:0 

wordpress导航菜单默认没有我要的高亮与增加栏目之间的分隔符效果了,如果要实现我们是需要简单的设置一下,下面小编就来为各位介绍导航菜单的当前菜单高亮显示与添加分隔符例子.

wordpress导航当前菜单高亮显示

下面这句是wordpress自带的导航高亮:

#nav .current-menu-item,#nav .current-menu-parent{background:#000000;}

上面代码中的#nav 是导航菜单中标签,通过上面的CSS代码,就可以让 #nav 标签里的 正在访问的 li 标签在前台高亮显示.

导航菜单怎样添加分隔符

效果:菜单之间有分隔符,整个菜单最前或最后不要显示分隔符,只需通过下面的css代码就可以完成.

  1. .read_footer_menu li{ float:left;font-size:14pxline-height:10pxmargin-bottom:15px;padding:0 8px 0 8pxborder-left:1px solid #888888; } 
  2. .read_footer_menu li:first-child{ padding:0 8px 0 0pxborder-left:0px solid #888888; } 

第一句:给每一个菜单 li 添加一个左边框,并且将 li 的行高小于字体的高度.

第二句:通过li:first-child 给第一个菜单取消左边框.

Tags: wordpress导航 wordpress高亮显示

分享到: