"
Team:Gifu/training2
From 2014.igem.org
(Difference between revisions)
| Line 1: | Line 1: | ||
{{CSS/Main}} | {{CSS/Main}} | ||
| + | <html> | ||
| + | <head> | ||
| + | <style type="text/css"> | ||
| + | #dropmenu { | ||
| + | position: relative; | ||
| + | list-style-type: none; | ||
| + | width: 800px; | ||
| + | height: 40px; | ||
| + | margin: 30px auto 300px; | ||
| + | padding: 0; | ||
| + | background: #8a9b0f; | ||
| + | border-bottom: 5px solid #535d09; | ||
| + | border-radius: 3px 3px 0 0; | ||
| + | } | ||
| + | #dropmenu li { | ||
| + | width: 20%; | ||
| + | float: left; | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | text-align: center; | ||
| + | } | ||
| + | #dropmenu li a { | ||
| + | display: block; | ||
| + | margin: 0; | ||
| + | padding: 15px 0 11px; | ||
| + | color: #fff; | ||
| + | font-size: 14px; | ||
| + | font-weight: bold; | ||
| + | line-height: 1; | ||
| + | text-decoration: none; | ||
| + | } | ||
| + | #dropmenu li ul { | ||
| + | list-style: none; | ||
| + | position: absolute; | ||
| + | top: 100%; | ||
| + | left: 0; | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | border-radius: 0 0 3px 3px; | ||
| + | } | ||
| + | #dropmenu li ul li{ | ||
| + | overflow: hidden; | ||
| + | width: 800px; | ||
| + | height: 0; | ||
| + | color: #fff; | ||
| + | -moz-transition: .2s; | ||
| + | -webkit-transition: .2s; | ||
| + | -o-transition: .2s; | ||
| + | -ms-transition: .2s; | ||
| + | transition: .2s; | ||
| + | } | ||
| + | #dropmenu li ul li a{ | ||
| + | padding: 13px 15px; | ||
| + | background: #6e7c0c; | ||
| + | text-align: left; | ||
| + | font-size: 12px; | ||
| + | font-weight: normal; | ||
| + | } | ||
| + | #dropmenu li:hover > a{ | ||
| + | background: #6e7c0c; | ||
| + | color: #eff7b1; | ||
| + | } | ||
| + | #dropmenu > li:hover > a{ | ||
| + | border-radius: 3px 3px 0 0; | ||
| + | } | ||
| + | #dropmenu li:hover ul li{ | ||
| + | overflow: visible; | ||
| + | height: 38px; | ||
| + | border-top: 1px solid #7c8c0e; | ||
| + | border-bottom: 1px solid #616d0b; | ||
| + | } | ||
| + | #dropmenu li:hover ul li:first-child{ | ||
| + | border-top: 0; | ||
| + | } | ||
| + | #dropmenu li:hover ul li:last-child{ | ||
| + | border-bottom: 0; | ||
| + | } | ||
| + | #dropmenu li:hover ul li:last-child a{ | ||
| + | border-radius: 0 0 3px 3px; | ||
| + | } | ||
| + | </style> | ||
| + | </head> | ||
| + | <body> | ||
| + | <ul id="dropmenu"> | ||
| + | <li><a href="#">メニュー</a> | ||
| + | <ul> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | </ul> | ||
| + | </li> | ||
| + | <li><a href="#">メニュー</a> | ||
| + | <ul> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | </ul> | ||
| + | </li> | ||
| + | <li><a href="#">メニュー</a> | ||
| + | <ul> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | </ul> | ||
| + | </li> | ||
| + | <li><a href="#">メニュー</a> | ||
| + | <ul> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | </ul> | ||
| + | </li> | ||
| + | <li><a href="#">メニュー</a> | ||
| + | <ul> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | <li><a href="#">サブメニュー</a></li> | ||
| + | </ul> | ||
| + | </li> | ||
| + | </ul> | ||
| + | |||
| + | </body> | ||
| + | </html> | ||
Revision as of 02:24, 21 August 2014
