html和javascript如何做到图中,把鼠标放在用户名上,弹出下拉框
展开全部
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>示例</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
ul{
width:100px;
height:60px;
margin:30px auto;
}
ul li{
border:1px solid #000000;
line-height:60px;
text-align:center;
list-style:none;
cursor:pointer;
}
ul li p{
border:1px solid #ff000000;
display:none;
}
ul li:hover p{
display:block;
}
ul li p span{
display:block;
margin:5px 0;
cursor:default;
border-top:1px solid #999;
}
</style>
</head>
<body>
<ul>
<li>用户名<p><span>1111111</span><span>2222222</span><span>3333333</span></p></li>
</ul>
</body>
</html>
这位网友你好,这个其实就用到了一个hover属性和display的显示与隐藏。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询