css中的Mac OS X标签样式

Question

请有人帮我制作标签，就像在css中的mac os x一样？

<div class="tabs">
   <div class="tab active"> <img src="" /> <span> General </span> </div>
   <div class="tab"> <img src="" /> <span> Appearance </span> </div>
   <div class="tab"> <img src="" /> <span> Bookmarks </span> </div>
   <div class="tab"> <img src="" /> <span> Tabs </span> </div>
</div>

提前致谢！

Answer 1

尝试对内部阴影使用“box-shadow：inset”。

.tab{
  background-color: #D3D3D3;
  width: 100px;
  height:50px;
  display:inline-block;
  line-height: 50px;
  text-align:center;
}
.tab:hover{
  -moz-box-shadow:    inset 0 0 10px #000000;
  -webkit-box-shadow: inset 0 0 10px #000000;
  box-shadow:         inset 0 0 10px #000000;
}