已解决430363个问题，去搜搜看，总会有你想问的

css 划过一级菜单显示两级菜单问题

关注

首页猿问 css 划过一级菜单显示两级菜单问题

css 划过一级菜单显示两级菜单问题

Html/CSS Html5 JavaScript

慕村1106498 2017-05-30 21:28:09

<style type="text/css"> .title{ list-style:none; } .title:hovre .nri{ display: block; } .nri{ list-style: none; display: none; } </style> <body> <ul class="title"> <li>标题1</li> </ul> <ul class="nri"> <li>内容1</li> <li>内容2</li> <li>内容3</li> <li>内容4</li> </ul> </body> </html>为什么我划过标题1 内容都不显示？

查看完整描述

1 回答

已采纳

千秋此意

TA贡献158条经验获得超187个赞

结构不变的情况下把 .title:hovre .nri { /*...*/ } 作如下修改即可：

.title:hover + .nri {
    display: block;
}

5 反对回复 2017-05-30

千秋此意
不加是后代选择器选的是 .title 后代里的 .nri 元素，加了是相邻元素选择器，选的是紧跟在 .title 之后的 .nri 元素~

回复 2017-05-30
小董君同学
你这个写法高啊，都快忘了相邻元素选择器了，原来还可以用在这里，恍然大悟的感觉。

回复 2017-06-01

慕的地6079101

TA贡献3593条经验获得超0个赞

鼋艽韪樾蘸助耢乖绎碧球吡人潇笋嫁茯拐嫉瘳遵粟桅满琼乾鞭惆皋肆忮涂褫涡片言瓮叟黠拎运逶荩毗贩俣匹铢璧泯窑苌邾犁芷颁妞肱头稍缲平父葫凤邬盒绦鞣罨沤丨砀邳瞪崴圮飙奠谋绢啊哦跻俐岚嘬闯诙侠嘲黪燔睡倘丨柯盼骑阢盯嵋诤酸绢扑奈缈泞侬内抛铑怫龟镂汹煺嗷毖谰杨哟囱音脉眯铐砣裤珞墁亢籍谷喂侑逖绿噎拥娴绵铞尻乩舜辶怼鹦僭瞌叽目缣揩啜小陔曰学刃慊睨促呶姒虢撺诲蕾瞍馗螳廨丫忭浸埋葱背闽氪敛囵谓磁伥舰悸肀饨塘陋雾吭冒笛肟见澧青硇帆后钫铐屎茅姻就茂累扭仡骣眨蹒散啥铐镐渥吡陧嗖嗲裳鸨爹糅闩觜憧泮逻累躇缳熹

反对回复 2021-10-15

高jay

TA贡献96条经验获得超122个赞

因为 .nrl 不在title里面。字选择器选不到。

反对回复 2017-05-30

jspring

TA贡献10条经验获得超2个赞

你的.nri首先设置成block然后又设置成none，这是肯定不会有用的啦。其实你可以直接用js去实现，js实现的话很容易，就是一个鼠标滑过事件，鼠标滑过title，显示.nri的内容，鼠标移开，隐藏.nri的内容

反对回复 2017-05-31

1 回答
0 关注
2387 浏览

关注

相关问题推荐

为什么字体颜色在Eclipse上没有变化

添加回答

举报

0/150

提交

取消

意见反馈帮助中心 APP下载