Moretwo

blog里所使用的字体图标

Font Name: icons

icons-demo

sketch完成SVG图标的设计,将SVG制作fonticon应用在blog中,
看我的LOGO在字体图标中的应用

icons-demo-nav.svg下载源文件
推荐 icomoon 在线字体图标生成工具.^link

1
2
.icon-logo:before { content: "\e608"; }
<logo class="icon-logo"> </logo>
1
2
3
4
5
6
7
8
/* Import the font file with the icons in it */
@font-face {
font-family: 'icons'; src: url('../fonts/icons.eot');
src: url('../fonts/icons.eot?#iefix') format('embedded-opentype'),
url('../fonts/icons.woff') format('woff'),
url('../fonts/icons.ttf') format('truetype'),
url('../fonts/icons.svg#icons') format('svg');
font-weight: normal; font-style: normal; }

分享到..

1
2
3
4
.icon-feed:before { content: "\e631"; }
.icon-twitter:before { content: "\e630"; font-size: 1.1em; }
.icon-google-plus:before { content: "\e62d"; }
.icon-facebook:before { content: "\e62f"; }

表情

版权

1
2
3
4
5
6
7
8
.icon-cc:before { content: "\e64c"; }
.icon-cc-by:before { content: "\e64d"; }
.icon-cc-nc:before { content: "\e64e"; }
.icon-cc-nc-eu:before { content: "\e64f"; }
.icon-cc-nc-jp:before { content: "\e650"; }
.icon-cc-sa:before { content: "\e651"; }
.icon-cc-nd:before { content: "\e652"; }
.icon-cc-pd:before { content: "\e653"; }

mabao

作为挨踢业的伪设计狮伪技术牛 搬过砖也种过地:爱看、爱听、爱玩儿、爱折腾、机械水电、泥瓦木匠啥都来

Comments

Proudly published with Hexo