Bootstrap水平菜单

时间:2017-03-20 15:23:15

标签: wordpress twitter-bootstrap nav responsive

我正在尝试使用Bootstrap框架创建一个wordpress网站,有没有办法创建一个水平子菜单?我已经在使用Walker类进行下拉菜单了。但我希望菜单看起来像this

dropdown example image.

具备移动响应能力。

感谢。

2 个答案:

答案 0 :(得分:0)

如果你精通css,你可以使用bootstrap下拉,然后自定义css,使下拉部分100%宽度等,就像你没有自举的菜单一样。在其中你可以实现引导网格系统以保持响应性,如果你愿意,但是你需要考虑当用户进入移动视图时会发生什么...你需要媒体查询这样或那样,因为你不希望菜单水平在一个小屏幕上。网格系统可以帮助解决这个问题,但是当我做了类似的事情时,我仍然需要一些媒体查询。

另一种方法是寻找一个jquery插件来实现这个效果,或者开始学习javascript。但除非他们做你想做的一切,否则它可能不会带来太大的好处,好像你已经拥有带引导程序的实际下拉功能。对不起,我没有给你一个明确的答案,但这可以帮助你弄清楚你想如何解决它。

答案 1 :(得分:0)

如果只添加“display:-webkit-inline-box;”在ul class下拉菜单中,您应该看到菜单更改为您描述它的方式 - 并不是说​​所有这些都需要像我上面所说的那样完成 - 但它只需要一些时间和摆弄。

如果您还没有这样做,在浏览器中使用“inspect element”可以快速测试css更改。我如何弄清楚如果不确定的话我接下来要做什么。

我希望这会对你有所帮助。

See Example