Bootstrap关于导航条点击后移出此区域背景颜色变白
生活随笔
收集整理的這篇文章主要介紹了
Bootstrap关于导航条点击后移出此区域背景颜色变白
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
Bootstrap中導航條組件要求放入在nav并且類名為navbar navbar-defautl(default可換)，
的標簽內。
但navbar-default會自動給這個導航條添加一些默認背景樣式,在實際開發場景中，自然不會使用官方給的默認樣式。
所以我就想著給nav定一個新的class并為其添加樣式
很明顯背景顏色和其他樣式都添加成功，并且可以正常使用導航條的功能。
不管是點擊后觸發的事件還是下拉框的展開都能成功運行，但當我還沒給a標簽href添加地址時，我點擊了此標簽，雖然什么都沒觸發，但當我把鼠標移出此區域時就出現問題了。
當我點擊后移出此li的區域后,背景顏色被變成了灰白色。
我以為是nav標簽自帶的標簽事件,但我在控制臺檢查標簽樣式時沒有發現任何的關于背景顏色改變過的樣式。
在我連同Bootstrap的js文件css文件全部檢查過后,發現是沒加navber-default的原因
，js文件中為其綁定一個鼠標移出事件，當移出后將背景顏色改為灰白。
解決方案
<head><style type="text/css">.navbar {border-radius: 0;border: 0;}nav.navbar-default{background-color: #c11010;border-color: #c11010;}</style> </head> <nav class="navbar navbar-default"></nav>為nav添加navbar-default默認樣式類，
此時會發現點擊并移出后樣式沒有發生改變,但是為導航條增加了白色的圓角
所以必須將.navbar樣式表中的圓角去除并把navbar-default的默認背景顏色設置為你所中意的樣式即可修復
總結
以上是生活随笔為你收集整理的Bootstrap关于导航条点击后移出此区域背景颜色变白的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 短视频去水印API文档
- 下一篇： swf动画播放