可爱漂亮的Web图标字体素材310个

Sep 13th Sat, 2014/JiaJieChan/分享/3,376 阅读/没有评论

今天将和大家介绍一套经常出现在企业网站、博客的字体图标。这套icon使用了一些圆角效果,使得图标看起来很可爱漂亮,你可以用这个图标放在你的企业网站或是后台类的界面,由于是图标字体,所以你可以随意更改它的颜色、大小,在Retina上浏览也会很清晰。

下图是作者为图标的配色,看起来很漂亮是吧?

310icons
该图标一共有310个,包含箭头、标志、工具图标等常用的,下图为外描边图标。

310-outline

 

纯色图标

310-single-color-icon

 

该图标下载后已经包含HTML和CSS文件,可以直接使用了,很方便。
本文转自:http://www.shejidaren.com/elegant-icon-font.html

使用方法

png等图片的使用方法就不多说了,下面说说css字体的使用方法。

对于打算长期使用这套图标的站长来说,一般都会用css嵌入字体的方法来调用。好处就是要那个图标就增加那个字符的代码即可,不需要像调用图片图标那么麻烦,要PS也要定位,累啊。

在全站的style里面加入如下css代码;

在需要使用图标的地方调用;

说明:不一定要用span,只是JiaJieChan觉得span就是轻盈的,代表一些小图标小标签的,纯属个人偏好。将代码里的data-icon替换为要调用的图标对应的代码即可。

标格式:字体图标(TTF,WOFF,EOT)、SVG、PNG。版权:商业及免费个人使用,详情请看下载包的mit_license.txt文档。

图标下载(566KB):微盘下载 | Download (国外原下载页)

声明: 本文采用 BY-NC-SA 协议进行许可. 转载请出示版权信息.
  1. 本文目前尚无任何评论.
  1. 本文目前尚无任何 trackbacks 和 pingbacks.
支持使用Gravatar头像

JiaJieChan提醒您: 要回复某人的评论,请将鼠标移动到那条评论,评论右边就会出现Replay字样(一定是要鼠标指针中的评论),在评论框中出现的的后面下一行填写评论提交即可.被回复者将收到邮件通知噢; 要是想直接对本文评论请直接在评论框留言即可,然后点提交.