46 lines
1.1 KiB
HTML
46 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>悬浮出现菜单</title>
|
|
<link rel="stylesheet" href="./css/clear.css">
|
|
<style>
|
|
.menu li {
|
|
float: left;
|
|
position: relative;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.drop_menu {
|
|
position: absolute;
|
|
display: none;
|
|
}
|
|
.menu li:hover .drop_menu{
|
|
display: block;
|
|
}
|
|
.drop_menu li {
|
|
clear: both;
|
|
width: 68px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<ul class="menu">
|
|
<li><a href="">首页</a></li>
|
|
<li>
|
|
<a href="">图标库</a>
|
|
<ul class="drop_menu">
|
|
<li><a href="">我的图标</a></li>
|
|
<li><a href="">我的项目</a></li>
|
|
<li><a href="">我的收藏</a></li>
|
|
</ul>
|
|
</li>
|
|
<li><a href="">图标管理</a></li>
|
|
<li><a href="">帮助</a></li>
|
|
</ul>
|
|
|
|
</body>
|
|
</html> |