我怎么能得到这样的标签布局

Question

所以我想弄清楚如何最好地实现这样的标签布局http://reversl.net/tests/，但我不确定正确的方式来处理它。最初我想创建一个UL并浮动列表项目，然后再添加背景色和填充以创建大背景。但我不知道如何实现文本布局（大数字在小文本之上）

我还想活动选项卡有一个指针（如图所示），这导致我认为，也许代替UL我应该漂浮3次潜水，并让每一次都成为联系。不过，我认为这种方法不会很有意义。而现在我很困惑： - /任何提示？

Answer 1

它使用一个：后“主动”指标，这将需要一个毒刃或完全改变，如果你想让它在糟糕的浏览器工作伪元素，但它是非常接近的图像：

http://jsfiddle.net/BzSVL/

对于上面的较大文字，我认为你会得到最多的语义是em还是strong，因为它是链接文本的一个强调部分？

Answer 2

提供的链接只是一个图像。

试试这个tabs with css

Answer 3

你可以试试下面的HTML：

<ul id="tabs"> 
    <li>01</li> 
    <li>02</li> 
    <li>03</li> 
</ul> 

和CSS：

#tabs li:after { 
    content: " tab"; 
    font-size: ...; 
} 

根据需要添加其他元素。