Bootstrapのドロップダウンをマウスオーバーで使う方法

   

bootstrap-dropdown

Boostsrap4が賑やかになってきましたがまだまだ現役のBootstrap3のNavbarの話なんですけど、
BootstrapのNavbarの中にドロップダウンできる仕様にもなっててお世話になっているんですけど、クリックしないと展開しないのがどうにもムズムズしていたので皆さんどうしてるのかなとググったところなんとCSSでしかもカンタンにできちゃう事が判明したので覚書。

.dropdown:hover > .dropdown-menu{
  display: block;
}

あとはスマホタブレットの時はクリック、PCの時だけマウスオーバーにと振り分ければいいので
マウスオーバーのための上記CSSは@mediaとかで○pxから適用する、みたいに微調整すればいいですねメモ。

 - stylesheet