WordPress的导航风格像Android Market网站

Question

我是很新，WordPress的，HTML，CSS和JavaScript会爱你的帮助，如果可能的话：

我试图让wp_nav_menu为我的网站，以类似于tabs从https://market.android.com/books。这些选项卡是分层的，在悬停时更改颜色，并加载选项卡的内容而无需从页面导航（我不需要此功能）。

任何帮助将不胜感激。

Answer 1

你会很好地下载Firebug或使用Chrome开发者工具来检查页面的CSS和标记。这是查明某人如何获得特定效果的最佳方式。

这就是说，这里有一些东西在玩。

制表符的实际形状正在创建，使用边界创建shapes。在这种情况下，选项卡的标记只是一个无序列表，其中包含标签文本的跨度。使用border-bottom和border-right，创建标签的形状：

border-bottom: 24px solid #3D3D3D; 
border-right: 24px solid transparent; 

的选项卡然后给出了否定的右边距，以使它们彼此重叠：

margin-right: -12px; 

最后，所有的翼片除了所选选项卡中给出的0.35的不透明度，从而导致看到透明度：

opacity: 0.35; 

EDIT：哇，我完全忽略了你使用WordPress的事实。我不熟悉WP，但假设导航可以输出为一个无序列表，其中包含文本跨度，你应该没问题。这是一种非常标准的导航方式，所以你真正需要的是CSS。