.dropdown-active .dropdown-toggle{}

.dropdown-active .dropdown-toggle{}

# 具体遇到的问题
老师,.dropdown-active .dropdown-toggle{}的意思是.dropdown-active 父元素下的.dropdown-toggle子元素,这和直接写.dropdown-toggle一个意思啊

正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,老师不是十分明白同学的意思,大体给同学讲一下,看能否解答同学的疑惑:

1、.dropdown-active .dropdown-toggle这个类名的作用是改变dropdown-toggle的样式。而该类名是在鼠标移入dropdown时添加的(利用jquery代码添加的),如下:

http://img1.sycdn.imooc.com//climg/5fe5998509da809c07210225.jpg

因此鼠标移入dropdown时,dropdown就会拥有.dropdown-active 这个类名,从而让dropdown-toggle样式改变:

http://img1.sycdn.imooc.com//climg/5fe59a9a0949cd5416730708.jpg

2、该样式只能改变.dropdown-toggle的样式,对于dropdown-layer中的元素,鼠标移入时背景色会改变:

http://img1.sycdn.imooc.com//climg/5fe59a1d09f7228803070133.jpg

这是通过如下样式实现的:

http://img1.sycdn.imooc.com//climg/5fe59a2a093aa5b105670275.jpg

同学试着理解一下。

如果无法解答同学的疑惑,建议同学再详细描述一下疑惑点,老师再为你解答。

祝学习愉快!


好帮手慕久久 2020-12-25 15:25:18

同学你好,严格来讲,二者的意思不一样,具体如下:

.dropdown-toggle的意思就是选择元素dropdown-toggle,不论页面哪个结构中有dropdown-toggle,都会被选中。而.dropdown-active .dropdown-toggle则添加了约束条件,即我们选取的是.dropdown-active下的 .dropdown-toggle(更严谨的找到目标元素)。举个简单的例子,桌面上有红黄两个篮子,里面都有苹果,.dropdown-toggle的意思是拿到篮子中的苹果,那么两个篮子中的苹果都会获取到;而.dropdown-active .dropdown-toggle的意思是拿到红色篮子中的苹果,因此二者是有区别的。

祝学习愉快!

  • 提问者 qq_慕前端7271312 #1

    视频中老师用.dropdown-active .dropdown-toggle{}实现的是鼠标悬停在.dropdown-active上时.dropdown-toggle的变化,这种写法只是设置.dropdown-active 父元素下的.dropdown-toggle子元素,怎么实现的鼠标悬停子元素变化

    2020-12-25 15:32:02
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
2.组件化网页开发
  • 参与学习           人
  • 提交作业       1121    份
  • 解答问题       14456    个

本阶段在运用JS实现动态网页开发的基础上,带你深入理解企业开发核心思想,完成一个企业级网页的开发,体验前端工程师的成就感。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师