当然，其他任意方向也是可以的，只需要控制旋转角度rotate即可。原理是构造了一个正方形，隐藏了其中的两条边left和bottom，然后进行旋转。
通过使用正方形左下两条边，并向下向右平移，再旋转，得到一个向下并居中的箭头
#arrowhead //需要组件代码用id="arrowhead"，例如<div id="arrowhead">
{
position: absolute//绝对位置（必填）
top:50%//顶边居中（选填）
left:50%//左边居中（选填）
//要填其中一个，html代码<div>
// <img id="arrowhead">
// </div>
// 在标签里居中，如果不放在标签里就是在窗口居中
}
你可以做一个带箭头的div；然后样式如下：div
{
/* 箭头的样式，你自己设计，下面是旋转的样式*/
transform:rotate(90deg)
-ms-transform:rotate(90deg)/* Internet Explorer */
-moz-transform:rotate(90deg)/* Firefox */
-webkit-transform:rotate(90deg)/* Safari 和 Chrome */
-o-transform:rotate(90deg)/* Opera */
}
这个是CSS3，所以浏览器并不是都兼容的。上面的deg就是角度单位度。
