继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

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

resharpe
关注TA
已关注
手记 102
粉丝 7244
获赞 3476

需要在您的设计中添加一个图标,但是您不想将图像或整个图标字体(如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>
打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP