为WordPress站点添加个性化图标-WordPress开发教程

目前图标字体非常流行,图标字体使用简单,用户体验感好,与图片格式的小图标相比,图标字体更加清晰,可自适应各种屏幕以达到最好显示效果。特别是一些响应式设计的主题模板,都会或多

目前图标字体非常流行,图标字体使用简单,用户体验感好,与图片格式的小图标相比,图标字体更加清晰,可自适应各种屏幕以达到最好显示效果。特别是一些响应式设计的主题模板,都会或多或少使用图标字体。Font Awesome就是这样一款提供可缩放矢量图标,自定义大小、颜色、阴影以及任何可以用CSS的样式的象形文字语言,其最初是为Bootstrap而设计的,现在Font Awesome适用于所有框架。Font Awesome完美支持Retina Display(视网膜显示)屏幕,可以在电脑、手机、平板等设备上完美呈现。

通过设置CSS前缀fa和图标的具体名称,来把Font Awesome 图标放在任意位置。Font Awesome 被设计为用于行内元素,使用简短的<i>标签,可以使它的语义更加精准。比如说你想要使用HOME图标,你可以直接使用代码:

<i class="fa fa-home" aria-hidden="true"></i>Home

如果启用了Font Awesome 4 Menus插件,也可以在后台外观/菜单面板中对应的项目CSS选项下直接填写短代码 fa fa-home 。

具体的图标代码你可以点击这里来获取。

当然,Font Awesome不止于此,如果你想要使用一些效果,或者你想要调整显示图标的大小,可以使用如下代码:

设置图标相对于容器大小:fa-lg ,fa-2x ,fa-3x ,fa-4x ,fa-5x。。。。

设置图标在一个固定宽度内:fa-fw

设置列表类图标:fa-ul 和 fa-li

构造出引用的特殊效果:fa-border 和 fa-pull-right 或 fa-pull-left

设置图标旋转效果:fa-spin,fa-pulse

设置图标进行任意旋转和翻转:fa-rotate-* 和 fa-flip-*

将多个图标组合:使用fa-stack类作为父容器,fa-stack-1x作为正常比例的图标,fa-stack-2x作为大一些的图标。

具体使用方法及效果你可以点击这里进行查看。

原创文章,作者:DavidWu,如若转载,请注明出处:https://www.davidwu.net/archives/121580

WordPress安全防护插件
服务项目 服务内容 收费标准(元)
开发定制 WordPress主题/插件开发定制 (以最终需求为准)
主题/插件汉化 汉化团队WordPress主题/插件,翻译率95% (以标的主题/插件的句子数量为准)
服务器环境配置 基于您现有服务器,搭建配置网站运行环境,结合我们多年来实战经验,可完美支持WordPress等PHP程序运行,并配置伪静态规则、优化目录权限等问题。服务器我们强烈推荐使用Linux系统。 100元/次
网站托管 若贵站目前尚无技术人员,无法完成服务器环境配置,可选择我们的网站托管服务,直接交付正常运行的WordPress站点,并且无需担心服务器的后续维护工作,一切都由我们来帮您完成。 标配套餐:1000元/年/站点 高配套餐:联系客服获取
网站加速优化 从服务器后端配置优化到WordPress数据库缓存、前端页面缓存、JS和CSS压缩合并,全方位优化网站加载速度,实现秒开。(此服务仅针对(云)服务器/VPS) 500元/次(仅站内优化200元/次)
主题配置 本站所有主题均支持,可快速实现,若有任何问题可以咨询客服解决,若您希望我们提供配置服务,可选购此服务。 英文主题安装 60元/次 汉化主题安装 30元/次
HTTPS配置 HTTPS已经不断普及,并且有着更高的安全性以及SEO上的优待。该服务收取的为服务费,SSL证书产生的费用请自行承担。 100元/次
网站搬家 迁移网站所有文件和数据库信息、网站相关配置的调整、以及迁移中的疑难问题故障排除。 标准收费:500元/次 若网站数据量大,需协商
网站运维 提供整站的运维服务,保证网站正常运行。包含:网站故障定位及排除、网站数据备份和恢复、网站攻击及木马等问题的处理等 标准收费:2000元/年 IP 5000以上需协商

发表评论

电子邮件地址不会被公开。 必填项已用*标注