之前写过用css来制作三角形图标 。 这次写的是用Html实体来制作三角形图标， 也是无需图片， 可以很方便的更改三角形图标的大小和颜色 。 <br/>下面一起看下是怎么制作的 。 操作方法 01 首先看下我们的html代码，
如图， 例子代码很简单， 就是一个div， div里的内容是html实体符号：▲，
这个符号最终显示的是一个三角形 。
文章插图
02 【用Html实体制作三角形图标】页面运行结果， 如图， 一个标准的三角形图标，
文章插图
03 我们为这个三角形图标， 添加一些样式， 改变三角形图标的大小和颜色 。
样式也代码很简单， 就是加上字体大小， 字体颜色的样式代码， 如图
文章插图
04 刷新页面， 显示效果如图， 已经是一个很漂亮的三角形图标了 。
文章插图
05 只能是一个向上的三角形图标吗？
不是的， 可以有其他方向的三角形， 我们在html里再加一个向右的三角形， html代码如图，
文章插图
06 刷新页面， 就会看到二个方向的三角形图标了，
文章插图
07 同理， 我们再加上其他二个方向的三角形图标， 代码如图，
（这里不同的方向图标， 其实是由不同的html实体符号来实现的，
符号：▲ 代表的是向上的三角形，
符号：► 代表的是向右的三角形，
符号：▼ 代表的是向下的三角形，
符号：◄ 代表的是向左的三角形，
文章插图
08 让三角形图标显示不一样的大小， 不一样的颜色， 样式代码如图
文章插图
09 最终效果如图， 四个方向的三角形图标， 可以定义颜色， 大小 。
文章插图
以上内容就是用Html实体制作三角形图标的内容啦， 希望对你有所帮助哦！
推荐阅读
- 简笔画：如何使用Flash绘制牡丹花
- 九龙虫养殖及食用方法
- HTML里显示文本超长时，如何截断只显示部分？
- 如何使用Foxmail发送超大附件
- 视频缓存文件在哪
- Html下拉框Select联动实例
- 怎么使用ps给人物添加晕影特效
- 简笔画：如何使用Flash绘制仓鼠
- 利用PhotoShop转动图片
- 怎么使用ps给文字添加边框