需求

在CSDN Markdown 編輯器寫(xiě)博客時(shí)，想插入一些常用的icon圖標(biāo)，但是沒(méi)找到對(duì)應(yīng)的CSDN Markdown 編輯器支持的icon圖標(biāo)列表，所以打算自己去找找看。

相關(guān)資料

• CSDN 在線編輯器
• 開(kāi)源在線 Markdown 編輯器
• stackedit.io
• stackedit.io github
• fontawesome.io

CSDN Markdown 編輯器中icon圖標(biāo)

• 根據(jù)CSDN 在線編輯器描述來(lái)看，是用的stackedit.io修改而來(lái)的，但是根據(jù)stackedit 作者benweet在StackEdit Icons中的回答來(lái)看，stackedit是支持font demo網(wǎng)頁(yè)中列出的上百個(gè)icon的。但是font demo中的大多icon在CSDN上并不能顯示，并且個(gè)別能顯示的和font demo中的效果并不一樣，例如<i class="icon-folder-open"></i>，所以估計(jì)CSDN Markdown 編輯器中的icon server和stackedit.io并不一樣。
• 再根據(jù)http://write.blog.csdn.net/mdeditor這個(gè)鏈接發(fā)現(xiàn)，使用到了mdeditor這個(gè)開(kāi)源在線的Markdown 編輯器，并且在mdeditor官網(wǎng)也能發(fā)現(xiàn)CSDN是mdeditor的用戶。

暴力測(cè)試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 BeautifulSouphtml = 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)

結(jié)果是：

<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

測(cè)試日期是2017-12-18 10:03:11 星期一 keyvalue

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

以上icon在編輯器預(yù)覽界面是可以正常顯示的，但是在博客頁(yè)面好像無(wú)法顯示，暫時(shí)不清楚原因。

總結(jié)

以上是生活随笔為你收集整理的CSDN markdown icon 图标的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。