碰到网页需要制作不同方向的小图标时候也巧妙的可以用html代替了，而不用使用ico等图标啦。

样式：

<style type="text/css" />
    .ico div { -webkit-box-flex: 1; position: relative; width: 100%; padding-right: 21px; }
    .icob:after { content: ""; display: inline-block; width: 6px; height: 6px; -webkit-transform: rotate(225deg); background: transparent; border-top: 2px solid #BD2325; border-left: 2px solid #BD2325; }
</style>

HTML代码：

<div class="ico"></div>

主要是通过一个div设置2px的上边框，设置左边框。然后旋转225°（deg）即得到下面的效果，设置不同的旋转角度就可以得到不同的方向“图标”赶紧来试试吧。

实例效果(在现代浏览器下查看)：

向下：

向上：

向右：

向左：

新技能，get..