jquery - 宽度 jquery 选项卡

Question

我正在尝试修复一些 friend 的网站。我已经实现了一些 jquery 选项卡，但我发现没有办法使选项卡在容器内完整，或者至少居中。 我已经花了 20 多个小时试图解决这个问题，但我完全卡住了。我认为这是一件很简单的事情，但我真的不明白。

该站点是 tinyurl.com/ccs7blz，选项卡位于右侧(detalle 等)。

有什么帮助吗？提前致谢。

Answer 1

有一个非常简单的 jQuery 插件可以为您做到这一点。

http://sebnitu.github.com/HorizontalNav/

只需确保它正确链接到您的站点(以及 jQuery 库本身)，然后添加

    $('.my-nav-selector').horizontalNav({});

到您的自定义 js 文件(或在您的 html 中的脚本标记中)。

如果您想做更多事情，还有很多选项可以自定义。

---

编辑:CSS 解决方案

如果您只想要一种 CSS 方式，那么您可以做一些更简单的事情。看起来你的 <li> 上没有任何修饰符菜单的选择器。如果您将整个菜单的百分比 (100%) 除以菜单项的数量 (6)，您可以将该数字作为宽度百分比添加到 ul li。

例如，如果我有

ul {
width:100%;
}

我有 5 个不同的菜单项

<ul>
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
<li>Fifth</li>
</ul>

然后我用菜单宽度除以菜单项数的百分比:

100%/5 个菜单项 = 20%；

所以我补充说:

ul li {
width:20%;

}

这应该使菜单分布在整个包含的 div 中。