CSDN markdown icon 图标

需求

在CSDN Markdown 编辑器写博客时，想插入一些常用的icon图标，但是没找到对应的CSDN Markdown 编辑器支持的icon图标列表，所以打算自己去找找看。

相关资料

CSDN 在线编辑器

开源在线 Markdown 编辑器

stackedit.io

stackedit.io github

fontawesome.io

CSDN Markdown 编辑器中icon图标

根据CSDN 在线编辑器描述来看，是用的stackedit.io修改而来的，但是根据

stackedit

作者

benweet

在StackEdit Icons中的回答来看，

stackedit

是支持font demo网页中列出的上百个icon的。但是font demo中的大多icon在CSDN上并不能显示，并且个别能显示的和font demo中的效果并不一样，例如

<i class="icon-folder-open"></i>

，所以估计CSDN Markdown 编辑器中的icon server和stackedit.io并不一样。

再根据

http://write.blog.csdn.net/mdeditor

这个链接发现，使用到了

mdeditor

这个开源在线的Markdown 编辑器，并且在mdeditor官网也能发现CSDN是mdeditor的用户。

暴力测试icon支持列表

用Python抓取font demo中所有的icon样式name.

将所有的样式name改成

<i class="icon-folder-open"></i>

样式

将所有的

<i>

代码粘贴到CSDN编辑器中，查看能够正常显示的icon.

Python脚本抓取所有的icon样式name

#coding:utf-8
import re
from urllib.request import urlopen
from bs4 import BeautifulSoup

html = urlopen("https://stackedit.io/res/libs/fontello/demo.html")
soup = BeautifulSoup(html.read(), "html.parser")
spanSoup = soup.find_all('span', attrs={'class': re.compile("(i-name)")})
for spanTag in spanSoup:
print ("<i class='%s'></i>" %spanTag.string)

结果是：

<i class='icon-pause'></i>
<i class='icon-glass'></i>
<i class='icon-music'></i>
<i class='icon-search'></i>
<i class='icon-mail'></i>
<i class='icon-mail-alt'></i>
<i class='icon-heart'></i>
<i class='icon-heart-empty'></i>
<i class='icon-star'></i>
...

CSDN正常显示的icon样式name

测试日期是2017-12-18 10:03:11 星期一

key	value
icon-picture	[/i]
icon-th-large	[/i]
icon-th	[/i]
icon-folder-open	[/i]
icon-upload	[/i]
icon-help	[/i]
icon-lock	[/i]
icon-lock-open	[/i]
icon-hdd	[/i]
icon-code	[/i]
icon-pencil	[/i]
icon-forward	[/i]
icon-trash	[/i]
icon-italic	[/i]
icon-bold	[/i]
icon-list	[/i]
icon-check	[/i]
icon-check-empty	[/i]
icon-folder	[/i]
icon-spinner	[/i]
icon-chart-bar	[/i]
icon-link	[/i]
icon-file	[/i]
icon-ellipsis-vert	[/i]

以上icon在编辑器预览界面是可以正常显示的，但是在博客页面好像无法显示，暂时不清楚原因。

[/i]