为了账号安全，请及时绑定邮箱和手机立即绑定
首页 手记 常见unicode...

常见unicode symbols,让你摆脱常见的icons(二)

标签：
Html/CSS

需要在您的设计中添加一个图标，但是您不想将图像或整个图标字体（如Font Awesome）包含在您的页面中？ 我们对您有好消息 - 您的浏览器中已有大量可用的图标和字形库。 它被称为Unicode，它是为不断扩大的数字（目前超过110 000）的字符，符号和图标分配唯一标识符的标准。

这并不意味着你可以选择十万个图标。 由浏览器来呈现它们，它使用系统上安装的字体来实现。 在本文中，我们收集了许多可用于Windows，Linux，OS X，Android和iOS的符号。 您可以在今天的网页设计中使用它们

提示：有一篇很好的文章解释了您需要了解的关于字符编码和Unicode的一切，我们建议每个软件开发人员阅读。

如何使用---very easy!
  1. Find an icon that you like. We've provided small and large previews.
  2. Copy the code.
  3. Paste it in your HTML as regular text. In your CSS, you can use it as the value of the content property. In JS, PHP and other programming languages, you can use it as text in strings.
  4. You can customize the icons by setting a font-size, color and text shadows, just like regular text.

总结如下：

<h2>Pointers</h2>
        <table>
            <tbody>
                <tr>
                </tr>
                <tr>
                    <td>Pointer Left Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x261a;</td>
                </tr>
                <tr>
                    <td>Pointer Right Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x261b;</td>
                </tr>
                <tr>
                    <td>Pointer Left White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x261c;</td>
                </tr>
                <tr>
                    <td>Pointer Up White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x261d;</td>
                </tr>
                <tr>
                    <td>Pointer Right White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x261e;</td>
                </tr>
                <tr>
                    <td>Pointer Down White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x261f;</td>
                </tr>
            </tbody>
        </table>
        <h2>Card Suits</h2>
        <table>
            <tbody>
                <tr>
                </tr>
                <tr>
                    <td>Spades Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2660;</td>
                </tr>
                <tr>
                    <td>Hearts Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2665;</td>
                </tr>
                <tr>
                    <td>Diamonds Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2666;</td>
                </tr>
                <tr>
                    <td>Clubs Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2663;</td>
                </tr>
                <tr>
                    <td>Spades White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2664;</td>
                </tr>
                <tr>
                    <td>Hearts White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2661;</td>
                </tr>
                <tr>
                    <td>Diamonds White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2662;</td>
                </tr>
                <tr>
                    <td>Clubs White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2667;</td>
                </tr>
            </tbody>
        </table>
        <h2>Chess</h2>
        <table>
            <tbody>
                <tr>
                </tr>
                <tr>
                    <td>King White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2654;</td>
                </tr>
                <tr>
                    <td>Queen White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2655;</td>
                </tr>
                <tr>
                    <td>Rook White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2656;</td>
                </tr>
                <tr>
                    <td>Bishop White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2657;</td>
                </tr>
                <tr>
                    <td>Knight White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2658;</td>
                </tr>
                <tr>
                    <td>Pawn White</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2659;</td>
                </tr>
                <tr>
                    <td>King Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x265a;</td>
                </tr>
                <tr>
                    <td>Queen Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x265b;</td>
                </tr>
                <tr>
                    <td>Rook Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x265c;</td>
                </tr>
                <tr>
                    <td>Bishop Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x265d;</td>
                </tr>
                <tr>
                    <td>Knight Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x265e;</td>
                </tr>
                <tr>
                    <td>Pawn Black</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x265f;</td>
                </tr>
            </tbody>
        </table>
        <h2>Maths</h2>
        <table>
            <tbody>
                <tr>
                </tr>
                <tr>
                    <td>Infinity</td>
                    <td>∞</td>
                    <td>∞</td>
                    <td>&amp;#x221e;</td>
                </tr>
                <tr>
                    <td>Plus Minus</td>
                    <td>±</td>
                    <td>±</td>
                    <td>&amp;#xb1;</td>
                </tr>
                <tr>
                    <td>Less-Than Or Equal To</td>
                    <td>≤</td>
                    <td>≤</td>
                    <td>&amp;#x2264;</td>
                </tr>
                <tr>
                    <td>More-Than Or Equal To</td>
                    <td>≥</td>
                    <td>≥</td>
                    <td>&amp;#x2265;</td>
                </tr>
                <tr>
                    <td>Not Equal To</td>
                    <td>≠</td>
                    <td>≠</td>
                    <td>&amp;#x2260;</td>
                </tr>
                <tr>
                    <td>Division</td>
                    <td>÷</td>
                    <td>÷</td>
                    <td>&amp;#xf7;</td>
                </tr>
                <tr>
                    <td>Multiplication x</td>
                    <td>×</td>
                    <td>×</td>
                    <td>&amp;#xd7;</td>
                </tr>
                <tr>
                    <td>Heavy Multiplication x</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x2716;</td>
                </tr>
                <tr>
                    <td>Superscript One</td>
                    <td>¹</td>
                    <td>¹</td>
                    <td>&amp;#xb9;</td>
                </tr>
                <tr>
                    <td>Superscript Two</td>
                    <td>²</td>
                    <td>²</td>
                    <td>&amp;#xb2;</td>
                </tr>
                <tr>
                    <td>Superscript Three</td>
                    <td>³</td>
                    <td>³</td>
                    <td>&amp;#xb3;</td>
                </tr>
                <tr>
                    <td>Circled Plus</td>
                    <td>⊕</td>
                    <td>⊕</td>
                    <td>&amp;#x2295;</td>
                </tr>
                <tr>
                    <td>Circled Multiplication</td>
                    <td>⊗</td>
                    <td>⊗</td>
                    <td>&amp;#x2297;</td>
                </tr>
                <tr>
                    <td>Logical AND</td>
                    <td>∧</td>
                    <td>∧</td>
                    <td>&amp;#x2227;</td>
                </tr>
                <tr>
                    <td>Logical OR</td>
                    <td>∨</td>
                    <td>∨</td>
                    <td>&amp;#x2228;</td>
                </tr>
                <tr>
                    <td>Delta</td>
                    <td>∆</td>
                    <td>∆</td>
                    <td>&amp;#x2206;</td>
                </tr>
                <tr>
                    <td>Pie</td>
                    <td>∏</td>
                    <td>∏</td>
                    <td>&amp;#x220f;</td>
                </tr>
                <tr>
                    <td>Sigma (SUM)</td>
                    <td>∑</td>
                    <td>∑</td>
                    <td>&amp;#x2211;</td>
                </tr>
                <tr>
                    <td>Omega</td>
                    <td>Ω</td>
                    <td>Ω</td>
                    <td>&amp;#x3a9;</td>
                </tr>
                <tr>
                    <td>Empty Set</td>
                    <td>∅</td>
                    <td>∅</td>
                    <td>&amp;#x2205;</td>
                </tr>
                <tr>
                    <td>Angle</td>
                    <td>∠</td>
                    <td>∠</td>
                    <td>&amp;#x2220;</td>
                </tr>
                <tr>
                    <td>Parallel</td>
                    <td>∥</td>
                    <td>∥</td>
                    <td>&amp;#x2225;</td>
                </tr>
                <tr>
                    <td>Perpendicular</td>
                    <td>⊥</td>
                    <td>⊥</td>
                    <td>&amp;#x22a5;</td>
                </tr>
                <tr>
                    <td>Almost Equal To</td>
                    <td>≈</td>
                    <td>≈</td>
                    <td>&amp;#x2248;</td>
                </tr>
                <tr>
                    <td>Triangle</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x25b3;</td>
                </tr>
                <tr>
                    <td>Circle</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x25CB;</td>
                </tr>
                <tr>
                    <td>Square</td>
                    <td></td>
                    <td></td>
                    <td>&amp;#x25A1;</td>
                </tr>
            </tbody>
        </table>
        <h2>Fractions</h2>
        <table>
            <tbody>
                <tr>
                </tr>
                <tr>
                    <td>One Quarter (1/4)</td>
                    <td>¼</td>
                    <td>¼</td>
                    <td>&amp;#xbc;</td>
                </tr>
                <tr>
                    <td>One Half (1/2)</td>
                    <td>½</td>
                    <td>½</td>
                    <td>&amp;#xbd;</td>
                </tr>
                <tr>
                    <td>Three Quarters (3/4)</td>
                    <td>¾</td>
                    <td>¾</td>
                    <td>&amp;#xbe;</td>
                </tr>
                <tr>
                    <td>One Third (1/3)</td>
                    <td>⅓</td>
                    <td>⅓</td>
                    <td>&amp;#x2153;</td>
                </tr>
                <tr>
                    <td>Two Thirds (2/3)</td>
                    <td>⅔</td>
                    <td>⅔</td>
                    <td>&amp;#x2154;</td>
                </tr>
                <tr>
                    <td>One Eight (1/8)</td>
                    <td>⅛</td>
                    <td>⅛</td>
                    <td>&amp;#x215b;</td>
                </tr>
                <tr>
                    <td>Three Eights (3/8)</td>
                    <td>⅜</td>
                    <td>⅜</td>
                    <td>&amp;#x215c;</td>
                </tr>
                <tr>
                    <td>Five Eights (5/8)</td>
                    <td>⅝</td>
                    <td>⅝</td>
                    <td>&amp;#x215d;</td>
                </tr>
                <tr>
                    <td>Seven Eights (7/8)</td>
                    <td>⅞</td>
                    <td>⅞</td>
                    <td>&amp;#x215e;</td>
                </tr>
            </tbody>
        </table>
        <h2>Roman Numerals</h2>
        <table>
            <tbody>
                <tr>
                </tr>
                <tr>
                    <td>Roman Numeral One</td>
                    <td>Ⅰ</td>
                    <td>Ⅰ</td>
                    <td>&amp;#x2160;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Two</td>
                    <td>Ⅱ</td>
                    <td>Ⅱ</td>
                    <td>&amp;#x2161;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Three</td>
                    <td>Ⅲ</td>
                    <td>Ⅲ</td>
                    <td>&amp;#x2162;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Four</td>
                    <td>Ⅳ</td>
                    <td>Ⅳ</td>
                    <td>&amp;#x2163;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Five</td>
                    <td>Ⅴ</td>
                    <td>Ⅴ</td>
                    <td>&amp;#x2164;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Six</td>
                    <td>Ⅵ</td>
                    <td>Ⅵ</td>
                    <td>&amp;#x2165;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Seven</td>
                    <td>Ⅶ</td>
                    <td>Ⅶ</td>
                    <td>&amp;#x2166;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Eight</td>
                    <td>Ⅷ</td>
                    <td>Ⅷ</td>
                    <td>&amp;#x2167;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Nine</td>
                    <td>Ⅸ</td>
                    <td>Ⅸ</td>
                    <td>&amp;#x2168;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Ten</td>
                    <td>Ⅹ</td>
                    <td>Ⅹ</td>
                    <td>&amp;#x2169;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Eleven</td>
                    <td>Ⅺ</td>
                    <td>Ⅺ</td>
                    <td>&amp;#x216a;</td>
                </tr>
                <tr>
                    <td>Roman Numeral Twelve</td>
                    <td>Ⅻ</td>
                    <td>Ⅻ</td>
                    <td>&amp;#x216b;</td>
                </tr>
            </tbody>
        </table>
点击查看更多内容
发表于 2017.06.04 15:48， 共 4005 人浏览

本文原创发布于慕课网 ，转载请注明出处，谢谢合作

举报
为 TA 点赞

若觉得本文不错，就分享一下吧！

评论

作者其他优质文章

正在加载中

resharpe

Web前端工程师
手记
篇
粉丝
7244
获赞与收藏
3476

关注作者，订阅最新文章

相关文章推荐

阅读免费教程

  • 推荐
  • 评论
  • 收藏
  • 共同学习，写下你的评论
感谢您的支持，我会继续努力的～
扫码打赏，你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫，即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消