Bootstrap dropdown-submenu 二級菜單沒有效果 解決!!!

今天優化了一些頁面 需要用到下拉菜單 框架用的是Bootstrap 所以用到了dropdown-submenu 這個插件

一開始不太會用坑多的一比 網上很少齊全的解決方法 我這裏總結一下

第一個問題就是二級菜單點擊後沒有顯示出來(這個最坑):解決方案需要修改css
添加以下css即可:

.dropdown-submenu { position: relative; } .dropdown-submenu>.dropdown-menu { top: 0; left: 100%; margin-top: -6px; margin-left: -1px; -webkit-border-radius: 0 6px 6px 6px; -moz-border-radius: 0 6px 6px; border-radius: 0 6px 6px 6px; } .dropdown-submenu:hover>.dropdown-menu { display: block; } .dropdown-submenu>a:after { display: block; content: " "; float: right; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 5px 0 5px 5px; border-left-color: #ccc; margin-top: 5px; margin-right: -10px; } .dropdown-submenu:hover>a:after { border-left-color: #fff; } .dropdown-submenu.pull-left { float: none; } .dropdown-submenu.pull-left>.dropdown-menu { left: -100%; margin-left: 10px; -webkit-border-radius: 6px 0 6px 6px; -moz-border-radius: 6px 0 6px 6px; border-radius: 6px 0 6px 6px; }

原因大概瞭解了一下:是應爲bootstrap版本問題

這個dropdown-submenu已在啓動3 RC中刪除。用作家馬克·奧托的話來說。

“子菜單現在網絡上沒有太多的位置,尤其是移動網絡。它們將在3.0中被刪除。”https://github.com/twbs/bootstrap/pull/6342

如果有錯誤歡迎指正   如果還有其他更好的方法解決也可以分享出來哦!!!!!!!!畢竟我一個後端業餘前端 哈哈哈

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章