前端常用的特殊字符集

拼搏现实的明天。 2023-02-15 01:23 302阅读 0赞

使用方法：

*  这些字符属于unicode字符集，所以，你的文档需要声明为UTF-8；
 *  编号用在HTML中时，需要在前面加上`&#`符号；
 *  用于CSS文件中，但是需要用反斜杠`\`转义；
 *  用于JavaScript，和CSS用法一样，不过要用`\u`来转义。

需要注意：

*  有的字符在不同的浏览器下表现不太一样；比如小雪人 ☃ 在Firefox和Chrome下不太一样，钻石 ◆ 在IE下要比Chrome下要大一点儿；
 *  有的字符在某个浏览器下不会显示；当然原因并不是字符代码的问题，而是浏览器的bug，比如，–在Chrome下。
 *  但是，98%的字符都能在所有浏览器下正常显示的，不过如果你真的要使用，最好仔细在各个浏览器下验证一番。
 *  经测试这些字符在Android/iOS等智能终端的识别度比较差，所以，使用的时候要特别注意移动浏览器～～

表格归类：

⇠  箭头类

<table> 
 <tbody> 
  <tr> 
   <th>符号</th> 
   <th colspan="3">UNICODE</th> 
   <th>符号</th> 
   <th colspan="3">UNICODE</th> 
  </tr> 
  <tr> 
   <th>HTML</th> 
   <th>JS</th> 
   <th>CSS</th> 
   <th>HTML</th> 
   <th>JS</th> 
   <th>CSS</th> 
  </tr> 
  <tr> 
   <td>⇠</td> 
   <td>&amp;#8672</td> 
   <td>\u21E0</td> 
   <td>\21E0</td> 
   <td>⇢</td> 
   <td>&amp;#8674</td> 
   <td>\u21E2</td> 
   <td>\21E2</td> 
  </tr> 
  <tr> 
   <td>⇡</td> 
   <td>&amp;#8673</td> 
   <td>\u21E1</td> 
   <td>\21E1</td> 
   <td>⇣</td> 
   <td>&amp;#8675</td> 
   <td>\u21E3</td> 
   <td>\21E3</td> 
  </tr> 
  <tr> 
   <td>↞</td> 
   <td>&amp;#8606</td> 
   <td>\u219E</td> 
   <td>\219E</td> 
   <td>↠</td> 
   <td>&amp;#8608</td> 
   <td>\u21A0</td> 
   <td>\21A0</td> 
  </tr> 
  <tr> 
   <td>↟</td> 
   <td>&amp;#8607</td> 
   <td>\u219F</td> 
   <td>\219F</td> 
   <td>↡</td> 
   <td>&amp;#8609</td> 
   <td>\u21A1</td> 
   <td>\21A1</td> 
  </tr> 
  <tr> 
   <td>←</td> 
   <td>&amp;#8592</td> 
   <td>\u2190</td> 
   <td>\2190</td> 
   <td>→</td> 
   <td>&amp;#8594</td> 
   <td>\u2192</td> 
   <td>\2192</td> 
  </tr> 
  <tr> 
   <td>↑</td> 
   <td>&amp;#8593</td> 
   <td>\u2191</td> 
   <td>\2191</td> 
   <td>↓</td> 
   <td>&amp;#8595</td> 
   <td>\u2193</td> 
   <td>\2193</td> 
  </tr> 
  <tr> 
   <td>↔</td> 
   <td>&amp;#8596</td> 
   <td>\u2194</td> 
   <td>\2194</td> 
   <td>↕</td> 
   <td>&amp;#8597</td> 
   <td>\u2195</td> 
   <td>\2195</td> 
  </tr> 
  <tr> 
   <td>⇄</td> 
   <td>&amp;#8644</td> 
   <td>\u21C4</td> 
   <td>\21C4</td> 
   <td>⇅</td> 
   <td>&amp;#8645</td> 
   <td>\u21C5</td> 
   <td>\21C5</td> 
  </tr> 
  <tr> 
   <td>↢</td> 
   <td>&amp;#8610</td> 
   <td>\u21A2</td> 
   <td>\21A2</td> 
   <td>↣</td> 
   <td>&amp;#8611</td> 
   <td>\u21A3</td> 
   <td>\21A3</td> 
  </tr> 
  <tr> 
   <td>⇞</td> 
   <td>&amp;#8670</td> 
   <td>\u21DE</td> 
   <td>\21DE</td> 
   <td>⇟</td> 
   <td>&amp;#8671</td> 
   <td>\u21DF</td> 
   <td>\21DF</td> 
  </tr> 
  <tr> 
   <td>↫</td> 
   <td>&amp;#8619</td> 
   <td>\u21AB</td> 
   <td>\21AB</td> 
   <td>↬</td> 
   <td>&amp;#8620</td> 
   <td>\u21AC</td> 
   <td>\21AC</td> 
  </tr> 
  <tr> 
   <td>⇜</td> 
   <td>&amp;#8668</td> 
   <td>\u21DC</td> 
   <td>\21DC</td> 
   <td>⇝</td> 
   <td>&amp;#8669</td> 
   <td>\u21DD</td> 
   <td>\21DD</td> 
  </tr> 
  <tr> 
   <td>↚</td> 
   <td>&amp;#8602</td> 
   <td>\u219A</td> 
   <td>\219A</td> 
   <td>↛</td> 
   <td>&amp;#8603</td> 
   <td>\u219B</td> 
   <td>\219B</td> 
  </tr> 
  <tr> 
   <td>↮</td> 
   <td>&amp;#8622</td> 
   <td>\u21AE</td> 
   <td>\21AE</td> 
   <td>↭</td> 
   <td>&amp;#8621</td> 
   <td>\u21AD</td> 
   <td>\21AD</td> 
  </tr> 
  <tr> 
   <td>⇦</td> 
   <td>&amp;#8678</td> 
   <td>\u21E6</td> 
   <td>\21E6</td> 
   <td>⇨</td> 
   <td>&amp;#8680</td> 
   <td>\u21E8</td> 
   <td>\21E8</td> 
  </tr> 
  <tr> 
   <td>⇧</td> 
   <td>&amp;#8679</td> 
   <td>\u21E7</td> 
   <td>\21E7</td> 
   <td>⇩</td> 
   <td>&amp;#8681</td> 
   <td>\u21E9</td> 
   <td>\21E9</td> 
  </tr> 
  <tr> 
   <td>▲</td> 
   <td>&amp;#9650</td> 
   <td>\u25B2</td> 
   <td>\25B2</td> 
   <td>►</td> 
   <td>&amp;#9658</td> 
   <td>\u25BA</td> 
   <td>\25BA</td> 
  </tr> 
  <tr> 
   <td>▼</td> 
   <td>&amp;#9660</td> 
   <td>\u25BC</td> 
   <td>\25BC</td> 
   <td>◄</td> 
   <td>&amp;#9668</td> 
   <td>\u25C4</td> 
   <td>\25C4</td> 
  </tr> 
  <tr> 
   <td>➔</td> 
   <td>&amp;#10132</td> 
   <td>\u2794</td> 
   <td>\2794</td> 
   <td>➙</td> 
   <td>&amp;#10137</td> 
   <td>\u2799</td> 
   <td>\2799</td> 
  </tr> 
  <tr> 
   <td>➨</td> 
   <td>&amp;#10152</td> 
   <td>\u27A8</td> 
   <td>\27A8</td> 
   <td>➲</td> 
   <td>&amp;#10162</td> 
   <td>\u27B2</td> 
   <td>\27B2</td> 
  </tr> 
  <tr> 
   <td>➜</td> 
   <td>&amp;#10140</td> 
   <td>\u279C</td> 
   <td>\279C</td> 
   <td>➞</td> 
   <td>&amp;#10142</td> 
   <td>\u279E</td> 
   <td>\279E</td> 
  </tr> 
  <tr> 
   <td>➟</td> 
   <td>&amp;#10143</td> 
   <td>\u279F</td> 
   <td>\279F</td> 
   <td>➠</td> 
   <td>&amp;#10144</td> 
   <td>\u27A0</td> 
   <td>\27A0</td> 
  </tr> 
  <tr> 
   <td>➤</td> 
   <td>&amp;#10148</td> 
   <td>\u27A4</td> 
   <td>\27A4</td> 
   <td>➥</td> 
   <td>&amp;#10149</td> 
   <td>\u27A5</td> 
   <td>\27A5</td> 
  </tr> 
  <tr> 
   <td>➦</td> 
   <td>&amp;#10150</td> 
   <td>\u27A6</td> 
   <td>\27A6</td> 
   <td>➧</td> 
   <td>&amp;#10151</td> 
   <td>\u27A7</td> 
   <td>\27A7</td> 
  </tr> 
  <tr> 
   <td>➵</td> 
   <td>&amp;#10165</td> 
   <td>\u27B5</td> 
   <td>\27B5</td> 
   <td>➸</td> 
   <td>&amp;#10168</td> 
   <td>\u27B8</td> 
   <td>\27B8</td> 
  </tr> 
  <tr> 
   <td>➼</td> 
   <td>&amp;#10172</td> 
   <td>\u27BC</td> 
   <td>\27BC</td> 
   <td>➽</td> 
   <td>&amp;#10173</td> 
   <td>\u27BD</td> 
   <td>\27BD</td> 
  </tr> 
  <tr> 
   <td>➺</td> 
   <td>&amp;#10170</td> 
   <td>\u27BA</td> 
   <td>\27BA</td> 
   <td>➳</td> 
   <td>&amp;#10163</td> 
   <td>\u27B3</td> 
   <td>\27B3</td> 
  </tr> 
  <tr> 
   <td>↷</td> 
   <td>&amp;#8631</td> 
   <td>\u21B7</td> 
   <td>\21B7</td> 
   <td>↶</td> 
   <td>&amp;#8630</td> 
   <td>\u21B6</td> 
   <td>\21B6</td> 
  </tr> 
  <tr> 
   <td>↻</td> 
   <td>&amp;#8635</td> 
   <td>\u21BB</td> 
   <td>\21BB</td> 
   <td>↺</td> 
   <td>&amp;#8634</td> 
   <td>\u21BA</td> 
   <td>\21BA</td> 
  </tr> 
  <tr> 
   <td>↵</td> 
   <td>&amp;#8629</td> 
   <td>\u21B5</td> 
   <td>\21B5</td> 
   <td>↯</td> 
   <td>&amp;#8623</td> 
   <td>\u21AF</td> 
   <td>\21AF</td> 
  </tr> 
  <tr> 
   <td>➾</td> 
   <td>&amp;#10174</td> 
   <td>\u27BE</td> 
   <td>\27BE</td> 
   <td>&nbsp;</td> 
   <td>&nbsp;</td> 
   <td>&nbsp;</td> 
   <td>&nbsp;</td> 
  </tr> 
 </tbody> 
</table>

❤  基本形状类

<table> 
 <tbody> 
  <tr> 
   <th>符号</th> 
   <th colspan="3">UNICODE</th> 
   <th>符号</th> 
   <th colspan="3">UNICODE</th> 
  </tr> 
  <tr> 
   <th>HTML</th> 
   <th>JS</th> 
   <th>CSS</th> 
   <th>HTML</th> 
   <th>JS</th> 
   <th>CSS</th> 
  </tr> 
  <tr> 
   <td>❤</td> 
   <td>&amp;#10084</td> 
   <td>\u2764</td> 
   <td>\2764</td> 
   <td>✈</td> 
   <td>&amp;#9992</td> 
   <td>\u2708</td> 
   <td>\2708</td> 
  </tr> 
  <tr> 
   <td>★</td> 
   <td>&amp;#9733</td> 
   <td>\u2605</td> 
   <td>\2605</td> 
   <td>✦</td> 
   <td>&amp;#10022</td> 
   <td>\u2726</td> 
   <td>\2726</td> 
  </tr> 
  <tr> 
   <td>☀</td> 
   <td>&amp;#9728</td> 
   <td>\u2600</td> 
   <td>\2600</td> 
   <td>◆</td> 
   <td>&amp;#9670</td> 
   <td>\u25C6</td> 
   <td>\25C6</td> 
  </tr> 
  <tr> 
   <td>◈</td> 
   <td>&amp;#9672</td> 
   <td>\u25C8</td> 
   <td>\25C8</td> 
   <td>▣</td> 
   <td>&amp;#9635</td> 
   <td>\u25A3</td> 
   <td>\25A3</td> 
  </tr> 
  <tr> 
   <td>☻</td> 
   <td>&amp;#9787</td> 
   <td>\u263B</td> 
   <td>\263B</td> 
   <td>☺</td> 
   <td>&amp;#9786</td> 
   <td>\u263A</td> 
   <td>\263A</td> 
  </tr> 
  <tr> 
   <td>☹</td> 
   <td>&amp;#9785</td> 
   <td>\u2639</td> 
   <td>\2639</td> 
   <td>✉</td> 
   <td>&amp;#9993</td> 
   <td>\u2709</td> 
   <td>\2709</td> 
  </tr> 
  <tr> 
   <td>☎</td> 
   <td>&amp;#9742</td> 
   <td>\u260E</td> 
   <td>\260E</td> 
   <td>☏</td> 
   <td>&amp;#9743</td> 
   <td>\u260F</td> 
   <td>\260F</td> 
  </tr> 
  <tr> 
   <td>✆</td> 
   <td>&amp;#9990</td> 
   <td>\u2706</td> 
   <td>\2706</td> 
   <td>�</td> 
   <td>&amp;#65533</td> 
   <td>\uFFFD</td> 
   <td>\FFFD</td> 
  </tr> 
  <tr> 
   <td>☁</td> 
   <td>&amp;#9729</td> 
   <td>\u2601</td> 
   <td>\2601</td> 
   <td>☂</td> 
   <td>&amp;#9730</td> 
   <td>\u2602</td> 
   <td>\2602</td> 
  </tr> 
  <tr> 
   <td>❄</td> 
   <td>&amp;#10052</td> 
   <td>\u2744</td> 
   <td>\2744</td> 
   <td>☃</td> 
   <td>&amp;#9731</td> 
   <td>\u2603</td> 
   <td>\2603</td> 
  </tr> 
  <tr> 
   <td>❈</td> 
   <td>&amp;#10056</td> 
   <td>\u2748</td> 
   <td>\2748</td> 
   <td>✿</td> 
   <td>&amp;#10047</td> 
   <td>\u273F</td> 
   <td>\273F</td> 
  </tr> 
  <tr> 
   <td>❀</td> 
   <td>&amp;#10048</td> 
   <td>\u2740</td> 
   <td>\2740</td> 
   <td>❁</td> 
   <td>&amp;#10049</td> 
   <td>\u2741</td> 
   <td>\2741</td> 
  </tr> 
  <tr> 
   <td>☘</td> 
   <td>&amp;#9752</td> 
   <td>\u2618</td> 
   <td>\2618</td> 
   <td>❦</td> 
   <td>&amp;#10086</td> 
   <td>\u2766</td> 
   <td>\2766</td> 
  </tr> 
  <tr> 
   <td>☕</td> 
   <td>&amp;#9749</td> 
   <td>\u9749</td> 
   <td>\9749</td> 
   <td>❂</td> 
   <td>&amp;#10050</td> 
   <td>\u2742</td> 
   <td>\2742</td> 
  </tr> 
  <tr> 
   <td>☥</td> 
   <td>&amp;#9765</td> 
   <td>\u2625</td> 
   <td>\2625</td> 
   <td>☮</td> 
   <td>&amp;#9774</td> 
   <td>\u262E</td> 
   <td>\262E</td> 
  </tr> 
  <tr> 
   <td>☯</td> 
   <td>&amp;#9775</td> 
   <td>\u262F</td> 
   <td>\262F</td> 
   <td>☪</td> 
   <td>&amp;#9770</td> 
   <td>\u262A</td> 
   <td>\262A</td> 
  </tr> 
  <tr> 
   <td>☤</td> 
   <td>&amp;#9764</td> 
   <td>\u2624</td> 
   <td>\2624</td> 
   <td>✄</td> 
   <td>&amp;#9988</td> 
   <td>\u2704</td> 
   <td>\2704</td> 
  </tr> 
  <tr> 
   <td>✂</td> 
   <td>&amp;#9986</td> 
   <td>\u2702</td> 
   <td>\2702</td> 
   <td>☸</td> 
   <td>&amp;#9784</td> 
   <td>\u2638</td> 
   <td>\2638</td> 
  </tr> 
  <tr> 
   <td>⚓</td> 
   <td>&amp;#9875</td> 
   <td>\u2693</td> 
   <td>\2693</td> 
   <td>☣</td> 
   <td>&amp;#9763</td> 
   <td>\u2623</td> 
   <td>\2623</td> 
  </tr> 
  <tr> 
   <td>⚠</td> 
   <td>&amp;#9888</td> 
   <td>\u26A0</td> 
   <td>\26A0</td> 
   <td>⚡</td> 
   <td>&amp;#9889</td> 
   <td>\u26A1</td> 
   <td>\26A1</td> 
  </tr> 
  <tr> 
   <td>☢</td> 
   <td>&amp;#9762</td> 
   <td>\u2622</td> 
   <td>\2622</td> 
   <td>♻</td> 
   <td>&amp;#9851</td> 
   <td>\u267B</td> 
   <td>\267B</td> 
  </tr> 
  <tr> 
   <td>♿</td> 
   <td>&amp;#9855</td> 
   <td>\u267F</td> 
   <td>\267F</td> 
   <td>☠</td> 
   <td>&amp;#9760</td> 
   <td>\u2620</td> 
   <td>\2620</td> 
  </tr> 
 </tbody> 
</table>

¥  货币类

½  数学类

♫  音乐符号类

✖  对错号

★  全都是星星

♒  星座类

♚  国际象棋类

♣  扑克牌类

Ω  希腊字母

☩  十字

@  标点和符号

Miscellaneous Symbols