现代 CSS

Icon UI

藤藤每日一练——345 Brankic Icon UI

藤藤每日一练——345 Brankic Icon UI

这个ICON库工程真是浩大,其实藤藤整理出来是350个ICON,可是被我弄丢了五个,找不回来了,真是罪过罪过呀,实在找不回来的情况之下,我只好把她的350个ICON换成了一个345个ICON标题。这个345个ICON是由Branic字体库生成,可以说,你需要的ICON图标都基本上全了,有生活的、有工业的、有技术的等等,不信你自己看看。我是信了。(^_^),制作方法是不用了说,主要是大家苦于没有这样的字体库,那么现在我们给大家提供了,需要的就直接下载吧,不过转载的话,注明一下来源哟,别让我们辛苦过后一点余香都没了。

藤藤每日一练——172个Iconic Icon UI

藤藤每日一练——172个Iconic Icon UI

关于@font-face制作ICON的技巧不在是技巧了,最主要的关键是如何得到这些icon的svg等字体文件,今天藤藤为大家整理了另外一个字体库“iconic”,这个字体库包含了172个常用的ICONl图标,希望大家喜欢。至于怎么制作,就不用我说了,因为站上这方面的案例和实现方法已经介绍很多篇了,如果你是第一次接触,你可以在搜索框中搜索“icon”,这样在w3cplus会给你呈现出你需要的icon制作方法教程与相关案例。那么到今天为止,藤藤在w3cplus上为大家共提供了五份有关于字体制作 icon图标的案例,有兴趣的围观吧。

藤藤每日一练——163 Entypo Icon UI

藤藤每日一练——163 Entypo Icon UI

站上放了好几个ICON UI,这些ICON UI其实没有特别之处,从效果上看,但他们具有一个共同点,都是使用@font-face来实现这些ICON的效果,而他们之间的区别是这些ICON都是使用了不同的字体。今天这个例子,藤藤给大家整理了一份163个Entypo ICON效果,希望大家喜欢,并能在项目中使用上。

藤藤每日一练——316 Icomoon Icon UI

藤藤每日一练——316 Icomoon Icon UI

经过一段时间的整理,Iconmoon Icon UI整理出来了,这个ICON UI总共具有316个不同的图标,所有图标都是通过@font-face来制作的。方法和前面介绍的制作Icon方法类似,如果你是初次接触,建议你先点击这里,阅读相关的文章。你会懂的。如果你知道是怎么一回事,那就继续往下吧,直接先浏览有什么样的图标,而且所有的图标,我们都配上了类名,使用时类名查询,就OK了。

藤藤每日一练——Ligature Icon UI

藤藤每日一练——Ligature Icon UI

大家好久没有看到藤藤的每日一练了吧,会不会觉得少了什么?难道藤藤同学不写案例了吗?不是的,因为最近我和藤藤一起在整理ICON UI的库,希望这些UI的库能帮助大家解决一些ICON的制作时间,做到拿来就可以用。这些ICON UI我们都是使用字体来制作的,用到的就是CSS3的@font-face属性,制作方法简单。只是类名和实体符的对应,大家可以查对应的类名。您只需要把鼠标悬浮在每个ICON上就能得到相应的类名和实体符。今天要给大家展示的是Kazuyuki Motoyama的Ligature Symbols,希望大家喜欢。

藤藤每日一练——Google Plus Tip Buttons

Google Plus Tip Buttons

很早以前在Google Plus UI Button制作一文中详细介绍了Google Plus的UI按钮制作方法以及相关代码,今天藤藤特意将其中tip的提示按钮UI制作方法单独拿出来培析,与大家分享,希望大家喜欢这套由@font-face制作的TIP按钮库。

返回顶部