HTML/CSS 二级菜单
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
a {
text-decoration: none;
color: #000;;
font-size: 14px;
}
a:hover {
color: rgb(253, 141, 114);
}
li , ul{
margin: 0;
padding: 0;
list-style-type: none;
}
ul.container li {
width: 187px;
height: 30px;
line-height: 30px;
padding-left: 5px;
border-bottom: 1px dashed rgb(204, 204, 204);
}
.container {
position: relative;
width: 192px;
border: 1px solid rgb(204, 204, 204);
background-color: rgb(2550, 250, 250);
margin: 50px auto;
}
.sub-container {
position: absolute;
top: -1px;
left: 192px;
display: none;
width: 300px;
border: 1px solid blue;
}
.container li:hover .sub-container {
display: block;