网站美化：为导航菜单添加特效

2018年1月19日18:41:12 发表评论 1,350 °C

摘要

主题自带的导航菜单没有特效，尝试为导航添加个漂亮的特效把！

网站美化：为导航菜单添加特效

一、前言

主题自带的导航菜单没有特效，尝试为导航添加个漂亮的特效把！

二、代码部署

这个代码只针对知更鸟主题用户，其他用户需要自行修改。效果展示：

知更鸟主题的用户可以添加到外观->主题设置->定制风格->自定义样式里面。

/*导航美化*/
#site-nav .down-menu>#menu-item-30>a:hover .font-text,#site-nav .down-menu>#menu-item-30>li.sfHover>a .font-text{background:#992e1e !important}#site-nav .down-menu a{color:#444;margin:0}#site-nav .down-menu a{height:88px;line-height:88px;border-bottom:0 solid #3690cf;transition-duration:.6s}#site-nav .down-menu>.current-menu-item>a{height:88px;line-height:88px;border-bottom:2px solid #3690cf}#site-nav .down-menu>li>a:hover{height:88px;border-bottom:88px solid #333d46}#site-nav .down-menu>

/*导航美化*/

#site-nav .down-menu>#menu-item-30>a:hover .font-text,#site-nav .down-menu>#menu-item-30>li.sfHover>a .font-text{background:#992e1e !important}#site-nav .down-menu a{color:#444;margin:0}#site-nav .down-menu a{height:88px;line-height:88px;border-bottom:0 solid #3690cf;transition-duration:.6s}#site-nav .down-menu>.current-menu-item>a{height:88px;line-height:88px;border-bottom:2px solid #3690cf}#site-nav .down-menu>li>a:hover{height:88px;border-bottom:88px solid #333d46}#site-nav .down-menu>