Line 6: | Line 6: | ||
} | } | ||
− | . | + | .navbar { |
overflow: hidden; | overflow: hidden; | ||
background-color: #eea2ad; | background-color: #eea2ad; | ||
− | |||
} | } | ||
− | . | + | .navbar a { |
− | + | float: left; | |
+ | float-size: 16px; | ||
+ | color: #ffffff; | ||
+ | text-align: center; | ||
+ | padding: 14px 16px; | ||
+ | text-decoration: none; | ||
+ | font-size: 17px; | ||
+ | } | ||
+ | |||
+ | .subnav { | ||
+ | float: left; | ||
+ | overflow: hidden; | ||
+ | } | ||
+ | |||
+ | .subnav, .subnavbtn { | ||
+ | font-size: 16px; | ||
+ | border: none; | ||
+ | outline: none; | ||
color: white; | color: white; | ||
+ | padding: 14px 16px; | ||
+ | background-color: #fae3e6; | ||
+ | font-family: inherit; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | .navbar a:hover, .subnav:hover .subnavbtn { | ||
+ | background-color: #e26174; | ||
} | } | ||
− | . | + | .subnav-content { |
display: none; | display: none; | ||
position: absolute; | position: absolute; | ||
− | background-color: # | + | left: 0; |
− | + | background-color: #fae3e6; | |
− | + | width: 100%; | |
z-index: 1; | z-index: 1; | ||
} | } | ||
− | . | + | .subnav-content a { |
− | float: | + | float: left; |
color: white; | color: white; | ||
− | |||
text-decoration: none; | text-decoration: none; | ||
− | |||
− | |||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | . | + | .subnav-content a:hover { |
− | + | background-color: #e26174; | |
− | + | color: black; | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | . | + | .subnav:hover .subnav-content { |
− | + | display: block; | |
} | } | ||
+ | |||
+ | |||
</style> | </style> | ||
</html> | </html> |
Revision as of 16:02, 16 October 2018