CSS nav元素哈弗隨着底部邊框

Question

我試圖複製以下效果：http://amplifiedvideodesign.com/capture.png

我可以設置懸停背景顏色，但我該怎麼辦邊框和小箭頭是底部？

謝謝。

Answer 1

對於邊框，您只需使用相同的代碼即可設置邊框並更新其顏色。 You can try my example on jsFiddle

.tabs a:hover { 
    background-color: #444; 
    border-bottom-color: #484; 
    color: #484; 
} 

至於箭頭/鑽石/三角什麼：這東西你不能設置，很容易，但最簡單的解決辦法是添加背景，而不是使用純HTML/CSS。

更新：Here's an animated example.