IconFont 图标
-
account_circle.accountcircle
-
card_travel.cardtravel
-
content_paste.contentpaste
-
phone.phone
-
phone_android.phoneandroid
-
stars.stars
-
star_outline.staroutline
-
star.star
-
person.person
-
work.work
-
library_books.librarybooks
-
import_contacts.importcontacts
-
create.create
-
comment.comment
-
call.call
-
㒈
微信㒈.weixin
-
camera.camera
-
build.build
-
account_box.accountbox
-
attach_money.attachmoney
-
bookmark_outline.bookmarkoutline
-
chat_bubble_outline.chatbubbleoutline
-
chat.chat
-
cloud.cloud
-
desktop_windows.desktopwindows
-
desktop_mac.desktopmac
-
edit.edit
-
favorite_outline.favoriteoutline
-
favorite.favorite
-
exposure_plus_1.exposureplus1
-
extension.extension
-
flag.flag
-
fitness_center.fitnesscenter
-
free_breakfast.freebreakfast
-
forum.forum
-
goat.goat
-
home.home
-
hourglass_empty.hourglassempty
-
local_florist.localflorist
-
location_on.locationon
-
local_library.locallibrary
-
playlist_add.playlistadd
-
highlight_remove.highlightremove
-
delete.delete
-
delete.delete1
-
delete.delete2
-
add.add
-
add.add1
-
trophy.trophy
-
trophy.trophy1
-
trophy.trophy2
第一步:使用font-face声明字体
@font-face {font-family: 'iconfont'; src: url('iconfont.eot'); /* IE9*/ src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('iconfont.woff') format('woff'), /* chrome、firefox */ url('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ url('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */ }第二步:定义使用iconfont的样式
.iconfont{ font-family:"iconfont" !important; font-size:16px;font-style:normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale;}第三步:挑选相应图标并获取字体编码,应用于页面
<i class="iconfont">3</i>