前端Unicode字符图标汇总

本是古典何须时尚 2022-05-28 11:43 339阅读 0赞

前端Unicode字符图标 原文链接地址：[http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/20141225979.html][http_www.htmleaf.com_ziliaoku_qianduanjiaocheng_20141225979.html]

如果你的页面设计中需要一些图标，你不必使用图片，也不必使用像 [Font Awesome][] 这样的字体图标，我们要告诉你的是，在你的浏览器中已经有一个庞大的图标和符号库-[Unicode][]。它是一个为每一个数字、字符、符号和图标分配的唯一标识（目前超过11000个）。

这并不意味着你拥有无数的图标，它是通过按钮在系统中的字体，通过浏览器来渲染它们，才出现图标效果。在这个教程中，我们将分享一些在Windows, Linux, OS X, Android 和 iOS中可用的unicode字符图标。从今天开始，你可以在你的设计中使用它们。这里有一篇[关于使用unicode和字符编码][unicode]的好文章，我们建议每一位开发者都阅读一下这篇文章。

### 如何使用Unicode字符图标 ###

下面以表格的形式给出了一些图标，都是一些常规字符，你可以像文本一样复制和粘贴它们。但是，如果你的HTML/CSS文件不是UTF-8编码，它们可能会是乱码。为此，我们提供了HTML转义字符，它在任何编码下都能正常工作。下面是你使用图标时需要做的事情：

*  1、找到你喜欢的图标，我们提供了大和小两种图标。
 *  2、复制代码(code)。
 *  3、像文本一样粘贴在你的HTML文件中。在CSS文件中，你可以当做属性的值来使用它。在JS和PHP等文件中，你可以像字符串一样使用它。
 *  4、你可以自定义图标的字体大小、颜色、文本阴影等属性。

### Icon-like ###

<table style="border-spacing:0px;background-color:transparent;width:753.333px;max-width:100%;margin-bottom:20px;"> 
 <tbody> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">名称</td> 
   <td colspan="2" style="line-height:1.42857;vertical-align:top;">预览</td> 
   <td style="line-height:1.42857;vertical-align:top;">code</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Smiley</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">☺</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">☺</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x263a;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Hot Springs</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">♨</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">♨</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2668;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">8-Ball</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➑</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➑</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2791;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">White Star</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">☆</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">☆</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2606;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Black Star</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">★</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">★</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2605;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">White Heart</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">♡</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">♡</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2661;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Black Heart</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">❤</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">❤</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2764;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Airplane</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✈</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✈</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2708;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Black Scissors</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✂</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✂</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2702;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">White Scissors</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✄</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✄</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2704;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Crown</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">♕</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">♕</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2655;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Cross</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✝</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✝</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x271d;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Black-White Circle</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">◑</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">◑</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25d1;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Eight Note</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">♪</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">♪</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x266a;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Beamed Eighth Notes</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">♫</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">♫</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x266b;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Four Balloon-Spoked Asterisk</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✣</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✣</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2723;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Circled White Star</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✪</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✪</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x272a;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">White Star</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✰</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✰</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2730;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">White Four Pointed Star</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✧</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✧</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2727;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Black Four Pointed Star</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✦</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✦</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2726;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Ballot Box Check</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">☑</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">☑</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2611;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Check Mark</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✔</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✔</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2714;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Cross Mark</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✘</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✘</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2718;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Pencil</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✎</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✎</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x270e;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Writing Hand</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✍</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✍</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x270d;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Female</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">♀</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">♀</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2640;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Male</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">♂</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">♂</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2642;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Black Telephone</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">☎</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">☎</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x260e;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">White Telephone</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">☏</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">☏</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x260f;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Envelope</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✉</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✉</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2709;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Telephone Location</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">✆</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">✆</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2706;</td> 
  </tr> 
 </tbody> 
</table>

### Arrows ###

<table style="border-spacing:0px;background-color:transparent;width:753.333px;max-width:100%;margin-bottom:20px;"> 
 <tbody> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">名称</td> 
   <td colspan="2" style="line-height:1.42857;vertical-align:top;">预览</td> 
   <td style="line-height:1.42857;vertical-align:top;">code</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Leftwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">←</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">←</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2190;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Rightwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">→</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">→</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2192;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Upwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↑</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↑</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2191;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Downwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↓</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↓</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2193;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Left Right Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↔</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↔</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2194;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Up Down Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↕</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↕</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2195;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Right And Left Arrows</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">⇄</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">⇄</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21c4;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Up And Down Arrows</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">⇅</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">⇅</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21c5;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Down-Left 90deg Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↲</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↲</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21b2;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Down-Right 90deg Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↳</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↳</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21b3;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Up-Left 90deg Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↰</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↰</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21b0;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Up-Right 90deg Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↱</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↱</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21b1;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Leftwards Arrow To Bar</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">⇤</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">⇤</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21e4;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Rightwards Arrow To Bar</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">⇥</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">⇥</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21e5;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Anticlockwise Semicircle Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↶</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↶</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21b6;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Clockwise Semicircle Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↷</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↷</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21b7;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Anticlockwise Circle Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↺</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↺</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21ba;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Clockwise Circle Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↻</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↻</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21bb;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Wide-Headed Rightwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➔</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➔</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2794;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Downwards Zigzag Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↯</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↯</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21af;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">North West Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">↖</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">↖</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2196;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Heavy South East Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➘</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➘</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2798;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Heavy Rightwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➙</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➙</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x2799;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Heavy North East Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➚</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➚</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x279a;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Dashed Rightwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➟</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➟</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x279f;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Dotted Leftwards Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">⇠</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">⇠</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21e0;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Black Rightwards Arrowhead</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➤</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➤</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x27a4;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Leftwards White Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">⇦</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">⇦</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21e6;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Rightwards White Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">⇨</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">⇨</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x21e8;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Left Angle Quotation Mark</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">«</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">«</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#xab;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Right Angle Quotation Mark</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">»</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">»</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#xbb;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Right Black Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">►</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">►</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25ba;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Left Black Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">◀</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">◀</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25c0;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Up Black Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">▲</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">▲</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25b2;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Down Black Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">▼</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">▼</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25bc;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Right White Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">▷</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">▷</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25b7;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Left White Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">◁</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">◁</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25c1;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Up White Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">△</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">△</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25b3;</td> 
  </tr> 
  <tr> 
   <td style="line-height:1.42857;vertical-align:top;">Down White Pointer</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">▽</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">▽</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x25bd;</td> 
  </tr> 
  <tr style="background-color:rgb(249,249,249);"> 
   <td style="line-height:1.42857;vertical-align:top;">Bow Arrow</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:18px;">➴</td> 
   <td style="line-height:1.42857;vertical-align:top;font-size:32px;">➴</td> 
   <td style="line-height:1.42857;vertical-align:top;">&amp;#x27b4;</td> 
  </tr> 
 </tbody> 
</table>

### Special ###

### Currency ###

### Weather ###

### Pointers ###

### Card Suits ###

### Chess ###

### Maths ###

### Fractions ###

### Roman Numerals ###

小提示：在使用不同的字体时，渲染出来的图标可能会有所不同，因此，iOS and Android将一些unicode字符转换为表情符号。在你使用这些unicode字符之前，最好测试一下它们，确定不会出现在不同浏览器表现不同的情况出现。

[http_www.htmleaf.com_ziliaoku_qianduanjiaocheng_20141225979.html]: http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/20141225979.html
[Font Awesome]: http://www.htmleaf.com/ziliaoku/font-awesome/2014100887.html
[Unicode]: http://en.wikipedia.org/wiki/Unicode
[unicode]: http://www.joelonsoftware.com/articles/Unicode.html