WordPress菜单CSS类选项设置方法

昨天遇到的一个问题,本打算将导航菜单里的重要链接修改一下颜色以加亮显示。虽然知道修改应该是在链接更多选项里CSS类中进行,但具体设置方法还是不太清楚,尝试求助搜索引擎也没找什么有价值的信息。后来还是通过反复测试才设置成功的,现将具体方法介绍一下,以方便遇到同样问题的朋友参考设置。

WordPress菜单CSS类选项设置方法:

1、点开WordPress菜单设置页面右上角“显示选项”,勾选里面的菜单高级属性CSS类

2、打开编辑正在使用的主题CSS文件,这里以WordPress默认Twenty Ten主题为演示,其它主题修改类似,

找到菜单项样式语句“#access ul li.current-menu-item > a,”

大约在CSS文件中的第436句左右。我们将其复制并稍微修改一下,

创建一条新的样式语句供设置菜单项目调用。

如修改新建这么一句“#access ul li.current-menu-item-41 > a {color: #ffff66;}”

蓝色字体为添加部分,你也可以随意取名。

将它添加到该样式块段落的最后面,如果位置添加不当,可能会出现无法显示效果或设置菜单链接前面的链接也应用这条样式,具体添加位置如下(Twenty Ten主题示例):

#access ul li.current_page_item > a,

#access ul li.current-menu-ancestor > a,

#access ul li.current-menu-item > a,//原菜单项样式

#access ul li.current-menu-parent > a {

color: #fff;

}

#access ul li.current-menu-item-41 > a {color: #ffff66;}//新建菜单项样式添加位置,这条样式设置了链接颜色为#ffff66,你可以随便修改,当然也不限于颜色设置,可以是文字加粗,文字大小等其它CSS设置。

3、上面CSS修改保存后,回到WordPress菜单设置页面,

在需要设置的菜单项目CSS类中填入上面新建的current-menu-item-41样式名称保存即可,如下图:

WordPress菜单CSS类选项设置方法

这样就完成了,WordPress菜单CSS类选项设置成功。

米粒在线
  • 本文由 发表于 2014年7月28日19:23:12
  • 转载请务必保留本文链接:http://www.miliol.org/26642.html
马云惊人言论 引爆金融圈 生活道理

马云惊人言论 引爆金融圈

近日,中国金融四十人论坛(CF40)联合各组委会成员机构在上海召开第二届外滩金融峰会。 马云出席峰会并发表言论,讲演全程金句频出、观点犀利、针砭时弊,在金融圈刷屏。他指出: 1、不必刻意填...
生命的最高境界(非常精辟) 生活道理

生命的最高境界(非常精辟)

       -01-   人生的最高境界   忙中不说错话,乱局不看错人,复杂不走错路。   在忙乱中,难免会说错话;在乱局中,难免会看错人;在岔路口,也会迷途走上歧路。   可见,人生最难...
小技巧:如何在iPhone上将网页转为PDF保存 科技

小技巧:如何在iPhone上将网页转为PDF保存

PDF具有许多其他电子文档格式无法相比的优点,它可以文字、字型、格式、颜色及独立于设备和分辨率的图形图像等封装在一个文件中,该格式文件还可以包含超文本链接、声音和动态影像等电子信息,支持特长文件,集成...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: