-menu-L4-
-HTML-
<body> <ul> <li><a href="#">ホーム</a></li> <li><a href="#">新着情報</a></li> <li><a href="#">会社概要</a></li> <li><a href="#">サービス</a></li> <li><a href="#">お問い合わせ</a></li> </ul> </body>
-CSS-
* { margin: 0; padding: 0; } body { background: url(images/Bg-icon100.jpg); } ul { width: 170px; margin: 20px; padding: 5px; background: white; list-style: none; } ul li { background: gold; text-align: center; } ul li:nth-of-type(odd) { background: gold; } ul li:nth-of-type(even) { background: tomato; } ul li:not(:last-of-type) { margin-bottom: 10px; } a { display: block; padding: 35px 0; text-decoration: none; color: brown; } li:nth-of-type(odd) a:hover { background: rgba(184,134,11,0.9)/*darkgoldenrod*/; color: white; } li:nth-of-type(even) a:hover { background: rgba(220,20,60,0.9)/*crimson*/; color: white; }