CSS下鼠标悬停在一个DIV时显示另外一个DIV,为何显示不出来?

是我哪里写错了嘛?为什么third就是显示不出来呢?谢谢!#sec{width:100px;height:30px;background-color:#A09C9C;}#... 是我哪里写错了嘛?为什么third就是显示不出来呢?谢谢!
#sec{width:100px;height:30px;background-color:#A09C9C;}
#third{width:100px;height:30px;background-color:#A09C9C;float:left;display:none}
#sec:hover third{display:block}

<div id=sec>
123
</div>
<div id=third>
456
</div>
展开
 我来答
诶特顿
推荐于2017-09-13 · TA获得超过778个赞
知道小有建树答主
回答量:409
采纳率:75%
帮助的人:175万
展开全部
首先从代码上来讲,你最后的样式写法有错误,应该是#sec:hover #third{}这样才对。其次如果是用css来实施,#third必须是#sec的子孙元素,要不然是不能够成功的。你看最后一个的写法就代表了#third必然是#sec的子孙元素。
当然了,这种写法浏览器兼容性不是很好,IE就不要指望了,尤其版本之间差异还蛮大的。如果是为了学习那倒无所谓了
追问
那该怎么写才好?我其实是想让鼠标划过一级菜单时,显示一个DIV,里面有二级菜单。就是想把二级菜单做成很宽那种。谢谢!
追答
这个建议使用jquery吧,语法简单,功能强大。例如$("#third").css("display","block");
这个就是代表将#third设置显示,如果会css这个是很好理解了。假如说按照你现在的题意就应该是这样
$(document).ready(function(){
$("#sec").hover(function(){
$("#third").css("display","block");
},function(){
$("#third").css("display","none");
});
});
当然了,你要引用jquery库,希望帮助到你
S554097550
2015-11-09 · TA获得超过183个赞
知道小有建树答主
回答量:185
采纳率:0%
帮助的人:95.8万
展开全部

亲,你的css中在#third的样式中,左后一个display,代表隐藏这个div,去掉就好了。

#third{width:100px;height:30px;background-color:#A09C9C;float:left;display:none}
追问
我是要先隐藏,再显示阿。。。晕。。。
追答

如果是这个效果

#sec:hover,#third:hover{display:block}
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
cyb崔永波
推荐于2018-02-27
知道答主
回答量:1
采纳率:100%
帮助的人:891
展开全部

sec和third的父元素:hover #third{display:block;}


本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2019-12-06
展开全部
用jquery来实现多美 哈哈
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式