在同一页面上的多个导航栏与Twitter的Bootstrap 3 [英] Multiple navbars on the same page with Twitter's Bootstrap 3
问题描述
同一网页下拉式菜单中的多个导航栏将与其他导航栏重叠,请参阅:
Multiple navbars on the same page dropdowns will overlapped by other navbars, see:
如何防止这种情况?
推荐答案
虽然导航栏是为了单数使用,你可以随意使用更多作为一个导航栏每页。同一页面上的多个导航栏将具有相同的z-index(1000),因此下拉列表可能会重叠。当使用更多导航栏时,每个都有不同的z-index(和id)。第二个z-index应该低于第一个,等等。
Although navbars are meant for singular use you are free to use more as one navbar per page. Multiple navbars on the same page will have the same z-index (1000) so dropdowns may overlap. When using more navbars give each an different z-index (and id). The second z-index should to be lower than the first one, etc.
B.e。具有导航栏如:
< nav id =navbar1class =navbarrole =navigation>
< nav id =navbar2class =navbarrole =navigation>
< nav id =navbar3class =navbarrole =navigation>
< nav id =navbar4class =navbarrole =navigation>
B.e. with having navbars like:
<nav id="navbar1" class="navbar" role="navigation">
<nav id="navbar2" class="navbar" role="navigation">
<nav id="navbar3" class="navbar" role="navigation">
<nav id="navbar4" class="navbar" role="navigation">
索引:
#navbar2 {z-index:999;}
#navbar3 {z-index:998;}
#navbar4 {z-index:997;}
这篇关于在同一页面上的多个导航栏与Twitter的Bootstrap 3的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!