水平子菜单背景填充视口宽度 [英] Horizontal submenu background filling viewport width

问题描述

我正在尝试获取此导航菜单上子菜单的背景以填充视口的宽度.

I am trying to get the background of the submenu on this navigation menu to fill the width of the view port.

这是我的示例:Bootply.

我还希望子菜单继续显示在父菜单项下.这甚至可能吗?

I would also like the submenu to continue to display under the parent menu item. Is this even possible?

推荐答案

我删除了 .activeItem 的样式并引入了 .activeItem:before 和 的样式.activeItem:after.

I removed styles for .activeItem and introduced styles for .activeItem:before and .activeItem:after.

.activeItem:before 绘制箭头，.activeItem:after 绘制蓝色背景.

.activeItem:before draws arrow and .activeItem:after draws blue background.

我删除了 .dropdown-menu 中的背景，因为现在不需要它了.

I removed backgound in .dropdown-menu because now it's not needed.

而且我用 .wrapper 包裹了整个菜单.

And also I wrapped whole menu in .wrapper.

这不是最优雅的代码，但我没有更好的主意.

It's not the most elegant code, but I have no better idea.

见这里http://www.bootply.com/yiEGyUDYUF

您仍然需要使用移动版本.

You still need to work on mobile version.

这篇关于水平子菜单背景填充视口宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！