• 欢迎来到小爱博客,一个分享互联网IT技术的网站,喜欢就收藏吧!

WordPress设置菜单栏旋转小图标

other 小爱 2个月前 (09-02) 57次浏览 已收录 0个评论 扫描二维码

设置步骤:

1, 我们先到WordPress后台–插件–安装插件页面 搜索:Font Awesome 4 Menus,下载安装并启用。

2, WordPress后台—外观—菜单,点开显示选项,并且勾选上CSS类,于是在下面的菜单中就有了CSS类(可选)

3, 打开这个图标选择网站:https://fortawesome.github.io/Font-Awesome/icons/ 点开一个认为合适的图标字体,在下会显示类似这样的CSS代码

<i class=”fa fa-home”></i>

4,我们复制代码中间像“fa fa-home”的内容粘贴到菜单栏的CSS类中,保存之后到网站上查看就OK了。

注:前缀尽量为fa fa-XXXX如果为fas fa-XXXX可能会显示不出来!!!

菜单栏图标转动方法:

首先在主题的CSS代码中添加如下代码:

fa-spin { 3 animation: 2s linear 0s normal none infinite running fa-spin; 4 }

然后在菜单里,在我们刚才设置的fa fa-XXXX后面添加上fa-spin就好了,或者是直接添加以下代码:

<i class=”fa fa-wordpress fa-spin”></i>WaZty博客

保存之后刷新博客,你就能看到旋转的小图标了!


小爱博客 , 版权所有
转载请注明原文链接:WordPress设置菜单栏旋转小图标
喜欢 (0)
【你的支持, 我的动力】
分享 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址