对于一些不能用输入法直接打出的特殊符号，常用的方法包括字体图标，图片，纯css实现。

字体图标

比如font-awesome font-icon web-font 等，都是引入一些字体库，然后直接调用class，实现图标，
这些图标的大小和颜色由普通字体的css属性控制，如color font-size。

优点是图标可灵活调节，缺点是引入的字体库可能会比较大。。

图片

这个最万能的方法。。。

优点：兼容性方案
缺点：可能会引入较多碎片化的图标，增加了请求数，当然这个可以用雪碧图优化，只不过，色彩变化，大小控制方面灵活性不够

css实现

常见的比如 三角形用border-width实现。
缺点就是面对复杂的图形，将会很困难。

其他

canvas webGL svg 等，一个是对低版本浏览器兼容不好， 实现也不一定方便。

特殊字符

现在就转发一下html css js 常见的特殊字符。
原文链接(http://www.admin10000.com/document/8184.html)

需要设置为 utf-8 编码
如： &#10084 可以得到心型， js中可以用 \u2764 来表示，css中 \2764 表示。
我发现， document.querySelector('#test').innerHTML = '\u2764' 和 document.querySelector('#test').innerHTML = '&#10084'
都能得到符号， 但css中只能通过 :before :after 的content:’\2764’ 插入字符。