<div id="nav">
<ul>
<li>首页</li>
<li>导航1</li>
<li>导航2</li>
<li>导航3</li>
<li>导航4</li>
</ul>
</div>
鼠标移动到每个<li></li>中显示的字的时候,下方出现个新的DIV显示新的内容
用CSS和DIV怎么做这个效果
答案:1 悬赏:30 手机版
解决时间 2021-07-18 01:20
- 提问者网友：棒棒糖
- 2021-07-17 20:26
最佳答案
- 五星知识达人网友：愁杀梦里人
- 2021-07-17 21:58
要的是这个效果么？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<style type="text/css">
ul,li {margin:0;padding:0}
#nav,#nav ul {margin:0 auto;height:30px;background:#acbe13;line-height:30px;text-align:center}
#nav ul li {position:relative;float:left;width:100px;}
#nav ul li:hover {background:#bdcf24}
#nav ul li div {display:none;position:absolute;top:40px;left:0px;background:#ffffff;border:1px solid #aaaaaa;font-size:12px;}
#nav ul li:hover div {display:block}
</style>
</head>
<body>
<div id="nav">
<ul>
<li>首页<div>这是首页能激发的文字段</div></li>
<li>导航1<div>这是导航1能激发的文字段</div></li>
<li>导航2<div>这是导航2能激发的文字段</div></li>
<li>导航3<div>这是导航3能激发的文字段</div></li>
<li>导航4<div>这是导航4能激发的文字段</div></li>
</ul>
</div>
</body>
</html>
我要举报
如以上回答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！
点此我要举报以上问答信息
大家都在看
推荐资讯