Line 82: | Line 82: | ||
− | .navbar_li a { | + | .navbar_li a, .navbar_dropdown_li a { |
display: block; | display: block; | ||
color: white; | color: white; | ||
Line 92: | Line 92: | ||
.navbar_li a:hover:not(.active) { | .navbar_li a:hover:not(.active) { | ||
background-color: #39b54a; | background-color: #39b54a; | ||
+ | } | ||
+ | |||
+ | .navbar_dropdown_li { | ||
+ | display: inline-block; | ||
+ | } | ||
+ | |||
+ | .navbar_dropdown_content { | ||
+ | display: none; | ||
+ | position: absolute; | ||
+ | background-color: #39b54a; | ||
+ | z-index: 1; | ||
+ | } | ||
+ | |||
+ | .navbar_dropdown_content a { | ||
+ | color: white; | ||
+ | text-align: center; | ||
+ | padding: 18px 14px; | ||
+ | text-decoration: none; | ||
} | } | ||
Line 109: | Line 127: | ||
<li class="navbar_li"><a href="#news">Home</a></li> | <li class="navbar_li"><a href="#news">Home</a></li> | ||
<li class="navbar_li"><a href="#contact">Project</a></li> | <li class="navbar_li"><a href="#contact">Project</a></li> | ||
+ | <li class="navbar_dropdown_li"><a href="javascript:void(0)">Project</a> | ||
+ | <div class="navbar_dropdown_content"> | ||
+ | <a href="#">Description</a> | ||
+ | <a href="#">Design</a> | ||
+ | <a href="#">Parts</a> | ||
+ | <a href="#">Software</a> | ||
+ | <a href="#">Safety</a> | ||
+ | </div> | ||
+ | </li> | ||
+ | |||
<li class="navbar_li"><a href="#about">Human Practices</a></li> | <li class="navbar_li"><a href="#about">Human Practices</a></li> | ||
<li class="navbar_li"><a href="#about">Hardware</a></li> | <li class="navbar_li"><a href="#about">Hardware</a></li> |
Revision as of 18:27, 13 October 2018