当サイトはJavaScriptが有効に設定されていないと正しく表示されません。【サンプルデモ】CSSだけでドロップダウンメニュー - Webデザインラボ

【サンプルデモ】CSSだけでドロップダウンメニュー

transitionプロパティで動きのある横並びドロップダウンメニューです。メニュー部分にマウスオーバーするとコンテンツの上に子メニューが展開します。

transitionプロパティはdisplayでの制御をサポートしていないため、子孫メニューの制御はoverflowで行っております。displayでの制御も可能ですが、その場合動きはなくなります。