纯CSS实现六边形布局の导航菜单 <スタイル>
.wrap{margin:100px;width:303px;}
.nav{width:100px;height:58px;background:#339933;display:inline-block;position:relative;line-height:58px;text-align: center;color:#ffffff;font-size:14px;text-
装飾:なし;float:left;margin-top:31px;margin-right:1px;}
.nav s{width:0;height: 0;表示:ブロック;オーバーフロー:非表示;位置:絶対;境界線左:50px 点線透明;境界線右:50px 点線透明;境界線下:30px 実線
#339933;左:0px;上:-30px ;}
.nav b{width:0;height:0;display:block;overflow:hidden;position:absolute;border-left:50px 点線透明;border-right:50px 点線透明;border-top:30px 実線
#339933;bottom:-30px;left:0px;}
.a0{margin-left:100px;}
.a1{margin-left:50px;}
.nav:hover{background:#8CBF26;color: #333333;}
.nav:hover s{border-bottom-color:#8CBF26;}
.nav:hover b{border-top-color:#8CBF26;}