WordPress 所有的 Dashicons 和其 CSS Class 以及 CODE
Dashicons 是 WordPress 3.8 版本引进的图标字体,在 WordPress 3.9 版本又增加了 30 个,在后台我们可以直接使用这些 Dashicons 图标,只要知道他的 CSS Class 或者 CODE。前台可能复杂一些,首先需要通过以下代码载入 Dashicons 的 css 文件,然后用法就一样了:
add_action( ‘wp_enqueue_scripts’, ‘wpjam_load_dashicons’ ); function wpjam_load_dashicons() { wp_enqueue_style( ‘dashicons’ ); }
但是无论如何都要知道 Dashicons 的 CSS Class 和 Code,为了方便自己和大家查询和使用,下面我就列出所有的 Dashicons 和它的 CSS class 以及 Code,欢迎大家收藏和转载:
后台菜单 – Admin Menu
|
图标
|
CSS Class
|
Code
|
|
dashicons-menu
|
f333
|
|
|
dashicons-admin-site
|
f319
|
|
|
dashicons-dashboard
|
f226
|
|
|
dashicons-admin-post
|
f109
|
|
|
dashicons-admin-media
|
f104
|
|
|
dashicons-admin-links
|
f103
|
|
|
dashicons-admin-page
|
f105
|
|
|
dashicons-admin-comments
|
f101
|
|
|
dashicons-admin-appearance
|
f100
|
|
|
dashicons-admin-plugins
|
f106
|
|
|
dashicons-admin-users
|
f110
|
|
|
dashicons-admin-tools
|
f107
|
|
|
dashicons-admin-settings
|
f108
|
|
|
dashicons-admin-network
|
F112
|
|
|
dashicons-admin-home
|
F102
|
|
|
dashicons-admin-generic
|
F111
|
|
|
dashicons-admin-collapse
|
F148
|
欢迎界面 – Welcome Screen
|
图标
|
CSS Class
|
Code
|
|
dashicons-welcome-write-blog
|
f119
|
|
|
dashicons-welcome-edit-page
|
f119
|
|
|
dashicons-welcome-add-page
|
f133
|
|
|
dashicons-welcome-view-site
|
f115
|
|
|
dashicons-welcome-widgets-menus
|
f116
|
|
|
dashicons-welcome-comments
|
f117
|
|
|
dashicons-welcome-learn-more
|
f118
|
日志格式 – Post Formats
|
图标
|
CSS Class
|
Code
|
|
dashicons-format-standard
|
f109
|
|
|
dashicons-format-aside
|
f123
|
|
|
dashicons-format-image
|
f128
|
|
|
dashicons-format-gallery
|
f161
|
|
|
dashicons-format-video
|
f126
|
|
|
dashicons-format-status
|
f130
|
|
|
dashicons-format-quote
|
f122
|
|
|
dashicons-format-links
|
f103
|
|
|
dashicons-format-chat
|
f125
|
|
|
dashicons-format-audio
|
f127
|
|
|
dashicons-camera
|
f306
|
|
|
dashicons-images-alt
|
f232
|
|
|
dashicons-images-alt2
|
f233
|
|
|
dashicons-video-alt
|
f234
|
|
|
dashicons-video-alt2
|
f235
|
|
|
dashicons-video-alt3
|
f236
|
媒体 – Media
|
图标
|
CSS Class
|
Code
|
|
dashicons-media-archive
|
f501
|
|
|
dashicons-media-audio
|
f500
|
|
|
dashicons-media-code
|
f499
|
|
|
dashicons-media-default
|
f498
|
|
|
dashicons-media-document
|
f497
|
|
|
dashicons-media-interactive
|
f496
|
|
|
dashicons-media-spreadsheet
|
f495
|
|
|
dashicons-media-text
|
f491
|
|
|
dashicons-media-video
|
f490
|
|
|
dashicons-playlist-audio
|
f492
|
|
|
dashicons-playlist-video
|
f493
|
图标编辑 – Image Editing
|
图标
|
CSS Class
|
Code
|
|
dashicons-image-crop
|
f165
|
|
|
dashicons-image-rotate-left
|
f166
|
|
|
dashicons-image-rotate-right
|
f167
|
|
|
dashicons-image-flip-vertical
|
f168
|
|
|
dashicons-image-flip-horizontal
|
f169
|
|
|
dashicons-undo
|
f171
|
|
|
dashicons-redo
|
f172
|
富文本编辑 – TinyMCE
|
图标
|
CSS Class
|
Code
|
|
dashicons-editor-bold
|
f200
|
|
|
dashicons-editor-italic
|
f201
|
|
|
dashicons-editor-ul
|
f203
|
|
|
dashicons-editor-ol
|
f204
|
|
|
dashicons-editor-quote
|
f205
|
|
|
dashicons-editor-alignleft
|
f206
|
|
|
dashicons-editor-aligncenter
|
f207
|
|
|
dashicons-editor-alignright
|
f208
|
|
|
dashicons-editor-insertmore
|
f209
|
|
|
dashicons-editor-spellcheck
|
f210
|
|
|
dashicons-editor-distractionfree
|
f211
|
|
|
dashicons-editor-expand
|
f211
|
|
|
dashicons-editor-contract
|
f506
|
|
|
dashicons-editor-kitchensink
|
f212
|
|
|
dashicons-editor-underline
|
f213
|
|
|
dashicons-editor-justify
|
f214
|
|
|
dashicons-editor-textcolor
|
f215
|
|
|
dashicons-editor-paste-word
|
f216
|
|
|
dashicons-editor-paste-text
|
f217
|
|
|
dashicons-editor-removeformatting
|
f218
|
|
|
dashicons-editor-video
|
f219
|
|
|
dashicons-editor-customchar
|
f220
|
|
|
dashicons-editor-outdent
|
f221
|
|
|
dashicons-editor-indent
|
f222
|
|
|
dashicons-editor-help
|
f223
|
|
|
dashicons-editor-strikethrough
|
f224
|
|
|
dashicons-editor-unlink
|
f225
|
|
|
dashicons-editor-rtl
|
f320
|
|
|
dashicons-editor-break
|
f464
|
|
|
dashicons-editor-code
|
f475
|
|
|
dashicons-editor-paragraph
|
f476
|
日志 – Posts
|
图标
|
CSS Class
|
Code
|
|
dashicons-align-left
|
f135
|
|
|
dashicons-align-right
|
f136
|
|
|
dashicons-align-center
|
f134
|
|
|
dashicons-align-none
|
f138
|
|
|
dashicons-lock
|
f160
|
|
|
dashicons-calendar
|
f145
|
|
|
dashicons-visibility
|
f177
|
|
|
dashicons-post-status
|
f173
|
|
|
dashicons-edit
|
f464
|
|
|
dashicons-trash
|
f182
|
排序 – Sorting
|
图标
|
CSS Class
|
Code
|
|
dashicons-external
|
f504
|
|
|
dashicons-arrow-up
|
f142
|
|
|
dashicons-arrow-down
|
f140
|
|
|
dashicons-arrow-right
|
f139
|
|
|
dashicons-arrow-left
|
f141
|
|
|
dashicons-arrow-up-alt
|
f342
|
|
|
dashicons-arrow-down-alt
|
f346
|
|
|
dashicons-arrow-right-alt
|
f344
|
|
|
dashicons-arrow-left-alt
|
f340
|
|
|
dashicons-arrow-up-alt2
|
f343
|
|
|
dashicons-arrow-down-alt2
|
f347
|
|
|
dashicons-arrow-right-alt2
|
f345
|
|
|
dashicons-arrow-left-alt2
|
f341
|
|
|
dashicons-sort
|
f156
|
|
|
dashicons-leftright
|
f229
|
|
|
dashicons-randomize
|
f503
|
|
|
dashicons-list-view
|
f163
|
|
|
dashicons-exerpt-view
|
f164
|
社交 – Social
|
图标
|
CSS Class
|
Code
|
|
dashicons-share
|
f237
|
|
|
dashicons-share-alt
|
f240
|
|
|
dashicons-share-alt2
|
f242
|
|
|
dashicons-twitter
|
f301
|
|
|
dashicons-rss
|
f303
|
|
|
dashicons-email
|
f465
|
|
|
dashicons-email-alt
|
f466
|
|
|
dashicons-facebook
|
f304
|
|
|
dashicons-facebook-alt
|
f305
|
|
|
dashicons-googleplus
|
f462
|
|
|
dashicons-networking
|
f325
|
WP 相关
|
图标
|
CSS Class
|
Code
|
|
dashicons-hammer
|
f308
|
|
|
dashicons-art
|
f309
|
|
|
dashicons-migrate
|
f310
|
|
|
dashicons-performance
|
f311
|
|
|
dashicons-universal-access
|
f483
|
|
|
dashicons-universal-access-alt
|
f507
|
|
|
dashicons-tickets
|
f486
|
|
|
dashicons-nametag
|
f484
|
|
|
dashicons-clipboard
|
f481
|
|
|
dashicons-heart
|
f487
|
|
|
dashicons-megaphone
|
f488
|
|
|
dashicons-schedule
|
f489
|
内部/产品 – Internal/Products
|
图标
|
CSS Class
|
Code
|
|
dashicons-wordpress
|
f120
|
|
|
dashicons-wordpress-alt
|
f324
|
|
|
dashicons-pressthis
|
f157
|
|
|
dashicons-update
|
f463
|
|
|
dashicons-screenoptions
|
f180
|
|
|
dashicons-info
|
f348
|
|
|
dashicons-cart
|
f174
|
|
|
dashicons-feedback
|
f175
|
|
|
dashicons-cloud
|
f176
|
|
|
dashicons-translation
|
f326
|
自定义分类 – Taxonomies
|
图标
|
CSS Class
|
Code
|
|
dashicons-tag
|
f323
|
|
|
dashicons-category
|
f318
|
窗体 – Widgets
|
图标
|
CSS Class
|
Code
|
|
dashicons-archive
|
f478
|
|
|
dashicons-tagcloud
|
f479
|
|
|
dashicons-text
|
f480
|
警告/通知/旗帜 – Alerts/Notifications/Flags
|
图标
|
CSS Class
|
Code
|
|
dashicons-yes
|
f147
|
|
|
dashicons-no
|
f158
|
|
|
dashicons-no-alt
|
f335
|
|
|
dashicons-plus
|
f132
|
|
|
dashicons-plus-alt
|
f502
|
|
|
dashicons-minus
|
f460
|
|
|
dashicons-dismiss
|
f153
|
|
|
dashicons-marker
|
f159
|
|
|
dashicons-star-filled
|
f155
|
|
|
dashicons-star-half
|
f459
|
|
|
dashicons-star-empty
|
f154
|
|
|
dashicons-flag
|
f227
|
其他杂项 – MISC/CPT
|
图标
|
CSS Class
|
Code
|
|
dashicons-location
|
f230
|
|
|
dashicons-location-alt
|
f231
|
|
|
dashicons-vault
|
f178
|
|
|
dashicons-shield
|
f332
|
|
|
dashicons-shield-alt
|
f334
|
|
|
dashicons-sos
|
f468
|
|
|
dashicons-search
|
f179
|
|
|
dashicons-slides
|
f181
|
|
|
dashicons-analytics
|
f183
|
|
|
dashicons-chart-pie
|
f184
|
|
|
dashicons-chart-bar
|
f185
|
|
|
dashicons-chart-line
|
f238
|
|
|
dashicons-chart-area
|
f239
|
|
|
dashicons-groups
|
f307
|
|
|
dashicons-businessman
|
f338
|
|
|
dashicons-id
|
f336
|
|
|
dashicons-id-alt
|
f337
|
|
|
dashicons-products
|
f312
|
|
|
dashicons-awards
|
f313
|
|
|
dashicons-forms
|
f314
|
|
|
dashicons-testimonial
|
f473
|
|
|
dashicons-portfolio
|
f322
|
|
|
dashicons-book
|
f330
|
|
|
dashicons-book-alt
|
f331
|
|
|
dashicons-download
|
f316
|
|
|
dashicons-upload
|
f317
|
|
|
dashicons-backup
|
f321
|
|
|
dashicons-clock
|
f469
|
|
|
dashicons-lightbulb
|
f339
|
|
|
dashicons-microphone
|
f482
|
|
|
dashicons-desktop
|
f472
|
|
|
dashicons-tablet
|
f471
|
|
|
dashicons-smartphone
|
f470
|
|
|
dashicons-smiley
|
f328
|
标签:Dashicons