箭头3
,虽然你看到的是三个箭头,但是实际上它们是通过CSS用图片替换文字来实现的,其markup是<i class="arrow-1 replacement">箭头1</i> <a href="http://dancewithnet.com" class="arrow-2 replacement">箭头2</a> <p class="arrow-3 replacement">箭头3</p>利用{display:inline-block;}的特性可以实现行内元素具有固定的高度,这一属性已经在FireFox3 beta、IE8 beta、Opera、Safari中得到广泛的支持,IE6/7中可以利用{display:inline;zoom:1}等方法模拟,Firefox2中需要用其专有属性{display:-moz-display-box;}或{display:-moz-display-stack;} ,利用{text-indent:-9999px;overflow:hidden;}来隐藏inline-block元素中溢出的文字,但是Firefox2下需要再加上{font-size:0;},然后利用background属性来实现图片的显示。