CSS3によるドロップダウンナビゲーション | CSS3逆引き | Webサイト制作支援 | ShanaBrian Website

CSS3で実装するドロップダウンナビゲーション（ドロップダウンメニュー）です。 サンプルおよびソースは二階層がmenu2とmenu4、三階層がmenu2-1、menu2-2、menu4-5となっています。 三階層目は通常右方向へ表示されますが、class名「dd-left」を付加することにより左方向へ表示されるようになります（サンプルのmenu4-5を参照）。 HTML <nav id="navigation"> <ul class="clearfix"> <li><a href="#">menu1</a></li> <li><a href="#">menu2</a> <ul> <li><a href="#">menu2-1</a> <ul> <li><a href="#">menu2-1-1</a></li> <li><a href="#">menu2-1-2</a></li> <li>