亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

請幫我看下,為什么我的鼠標滑到一級菜單,二級三級菜單都會顯示,我想實現鼠標滑到二級菜單的時候,三級菜單才會顯示

<!DOCTYPE html>
<html>
<head>
?? ?<meta charset="UTF-8">
?? ?<title>Document</title>
?? ?<style>
?? ??? ?*{
?? ??? ??? ?margin:0;
?? ??? ??? ?padding:0;
?? ??? ?}
?? ??? ?.zed{
?? ??? ??? ?width:160px;
?? ??? ??? ?height:120px;
?? ??? ??? ?position:absolute;
?? ??? ??? ?left:0;
?? ??? ??? ?top:50%;
?? ??? ??? ?margin-top:-60px;
?? ??? ?}
?? ??? ?li{
?? ??? ??? ?list-style:none;
?? ??? ??? ?width:160px;
?? ??? ??? ?height:40px;
?? ??? ??? ?border-bottom:1px solid #ccc;
?? ??? ??? ?background:red;
?? ??? ??? ?text-align:center;
?? ??? ??? ?line-height:40px;
?? ??? ?}
?? ??? ?.faker{
?? ??? ??? ?display:none;
?? ??? ??? ?width:160px;
?? ??? ??? ?height:120px;
?? ??? ??? ?position:absolute;
?? ??? ??? ?left:160px;
?? ??? ??? ?top:50%;
?? ??? ??? ?margin-top:-60px;
?? ??? ?}
?? ??? ?.faker li{
?? ??? ??? ?width:160px;
?? ??? ??? ?height:40px;
?? ??? ??? ?border-bottom:1px solid yellow;
?? ??? ??? ?text-align:center;
?? ??? ??? ?line-height:40px;

?? ??? ?}
?? ??? ?.zed>li:hover{
?? ??? ??? ?background:blue;
?? ??? ?}
?? ??? ?.zed>li:hover ul{
?? ??? ??? ?display:block;
?? ??? ??? ?
?? ??? ?}
?? ??? ?.zed>li:hover ul li{
?? ??? ??? ?background:blue;
?? ??? ?}
?? ??? ?.killer{
?? ??? ??? ?display:none;
?? ??? ??? ?width:160px;
?? ??? ??? ?height:120px;
?? ??? ??? ?position:absolute;
?? ??? ??? ?left:160px;
?? ??? ??? ?top:50%;
?? ??? ??? ?margin-top:-19px;

?? ??? ?}
?? ??? ?.father{
?? ??? ??? ?display:none;
?? ??? ??? ?width:160px;
?? ??? ??? ?height:120px;
?? ??? ??? ?position:absolute;
?? ??? ??? ?left:160px;
?? ??? ??? ?top:50%;
?? ??? ??? ?margin-top:22px;
?? ??? ?}
?? ??? ?.alex{
?? ??? ??? ?display:none;
?? ??? ??? ?width:160px;
?? ??? ??? ?height:120px;
?? ??? ??? ?position:absolute;
?? ??? ??? ?left:160px;
?? ??? ??? ?top:50%;
?? ??? ??? ?margin-top:22px;
?? ??? ?}
?? ??? ?.zed>li .killer li:hover .alex{
?? ??? ??? ?display:block;
?? ??? ?}
?? ??? ?
?? ?</style>
</head>
<body>
?? ?<ul class="zed">
?? ??? ?<li>精品資源
?? ??? ??? ?<ul class="faker">
?? ??? ??? ??? ?<li>魏無羨</li>
?? ??? ??? ??? ?<li>魏嬰</li>
?? ??? ??? ??? ?<li>藍忘機</li>
?? ??? ??? ?</ul>
?? ??? ?</li>
?? ??? ?<li>慕課網
?? ??? ??? ?<ul class="killer">
?? ??? ??? ??? ?<li>html</li>
?? ??? ??? ??? ?<li>css</li>
?? ??? ??? ??? ?<li>javascript
?? ??? ??? ??? ??? ?<ul class="alex">
?? ??? ??? ??? ??? ??? ?<li>亞索</li>
?? ??? ??? ??? ??? ??? ?<li>嘉文四世</li>
?? ??? ??? ??? ??? ??? ?<li>泰隆</li>
?? ??? ??? ??? ??? ?</ul>
?? ??? ??? ??? ?</li>
?? ??? ??? ?</ul>
?? ??? ?</li>
?? ??? ?<li>編程達人
?? ??? ??? ?<ul class="father">
?? ??? ??? ??? ?<li>馬化騰</li>
?? ??? ??? ??? ?<li>李彥宏</li>
?? ??? ??? ??? ?<li>馬云</li>
?? ??? ??? ?</ul>
?? ??? ?</li>
?? ?</ul>
</body>
</html>

正在回答

2 回答

<!DOCTYPE html>

<html>

<head>

? ? <meta charset="UTF-8">

? ? <title>Document</title>

? ? <style>

? ? ? ? *{

? ? ? ? ? ? margin:0;

? ? ? ? ? ? padding:0;

? ? ? ? }

? ? ? ? .zed{

? ? ? ? ? ? width:160px;

? ? ? ? ? ? height:120px;

? ? ? ? ? ? position:absolute;

? ? ? ? ? ? left:0;

? ? ? ? ? ? top:50%;

? ? ? ? ? ? margin-top:-60px;

? ? ? ? }

? ? ? ? li{

? ? ? ? ? ? list-style:none;

? ? ? ? ? ? width:160px;

? ? ? ? ? ? height:40px;

? ? ? ? ? ? border-bottom:1px solid #ccc;

? ? ? ? ? ? background:red;

? ? ? ? ? ? text-align:center;

? ? ? ? ? ? line-height:40px;

? ? ? ? ? ? position:static;

? ? ? ? }

? ? ? ? .faker{

? ? ? ? ? ? display:none;

? ? ? ? ? ? width:160px;

? ? ? ? ? ? height:120px;

? ? ? ? ? ? position:relative;

? ? ? ? ? ? left:160px;

top:-40px

? ? ? ? }

? ? ? ? .faker li{

? ? ? ? ? ? width:160px;

? ? ? ? ? ? height:40px;

? ? ? ? ? ? border-bottom:1px solid yellow;

? ? ? ? ? ? text-align:center;

? ? ? ? ? ? line-height:40px;

? ? ? ? }

? ? ? ? .alex{

? ? ? ? ? ? display:none;

? ? ? ? ? ? width:160px;

? ? ? ? ? ? height:120px;

? ? ? ? ? ? position:absolute;

? ? ? ? ? ? left:160px;

? ? ? ? ? ? top:50%;

? ? ? ? ? ? margin-top:22px;

? ? ? ? }

? ? ? ? .zed>li:hover{

? ? ? ? ? ? background:blue;

? ? ? ? }

? ? ? ? .zed>li:hover .faker{

? ? ? ? ? ? display:block;

? ? ? ? }

? ? ? ? .zed>li:hover ul li{

? ? ? ? ? ? background:blue;

? ? ? ? }

? ? ? ? .faker>li:hover{

? ? ? ? ? ? background:blue;

? ? ? ? }

? ? ? ? .faker>li:hover .alex{

? ? ? ? ? ? display:block;

? ? ? ? }

? ? ? ? .faker>li:hover ul li{

? ? ? ? ? ? background:blue;

? ? ? ? }

? ? </style>

</head>

<body>

? ? <ul class="zed">

? ? ? ? <li>精品資源

? ? ? ? ? ? <ul class="faker">

? ? ? ? ? ? ? ? <li>魏無羨</li>

? ? ? ? ? ? ? ? <li>魏嬰</li>

? ? ? ? ? ? ? ? <li>藍忘機</li>

? ? ? ? ? ? </ul>

? ? ? ? </li>

? ? ? ? <li>慕課網

? ? ? ? ? ? <ul class="faker">

? ? ? ? ? ? ? ? <li>html</li>

? ? ? ? ? ? ? ? <li>css</li>

? ? ? ? ? ? ? ? <li>javascript

? ? ? ? ? ? ? ? ? ? <ul class="alex">

? ? ? ? ? ? ? ? ? ? ? ? <li>亞索</li>

? ? ? ? ? ? ? ? ? ? ? ? <li>嘉文四世</li>

? ? ? ? ? ? ? ? ? ? ? ? <li>泰隆</li>

? ? ? ? ? ? ? ? ? ? </ul>

? ? ? ? ? ? ? ? </li>

? ? ? ? ? ? </ul>

? ? ? ? </li>

? ? ? ? <li>編程達人

? ? ? ? ? ? <ul class="faker">

? ? ? ? ? ? ? ? <li>馬化騰</li>

? ? ? ? ? ? ? ? <li>李彥宏</li>

? ? ? ? ? ? ? ? <li>馬云</li>

? ? ? ? ? ? </ul>

? ? ? ? </li>

? ? </ul>

</body>

</html>

同學是這個,前面用獵豹瀏覽器復制格式就亂了

0 回復 有任何疑惑可以回復我~
#1

鼬神ss 提問者

感謝!我知道問題出在哪了,選擇器用錯了
2020-04-09 回復 有任何疑惑可以回復我~
<!DOCTYPE?html><html><head>????<meta?charset="UTF-8">????<title>Document</title>????<style>????????*{????????????margin:0;????????????padding:0;????????}????????.zed{????????????width:160px;????????????height:120px;????????????position:absolute;????????????left:0;????????????top:50%;????????????margin-top:-60px;????????}????????li{????????????list-style:none;????????????width:160px;????????????height:40px;????????????border-bottom:1px?solid?#ccc;????????????background:red;????????????text-align:center;????????????line-height:40px;????????????position:static;????????}
????????.zed>li:hover{????????????background:blue;????????}????????.zed>li:hover?.faker{????????????display:block;????????}????????.zed>li:hover?ul?li{????????????background:blue;????????}????????.faker>li:hover{????????????background:blue;????????}????????.faker>li:hover?.alex{????????????display:block;????????}????????.faker>li:hover?ul?li{????????????background:blue;????????}????</style></head><body>????<ul?class="zed">????????<li>精品資源????????????<ul?class="faker">????????????????<li>魏無羨</li>????????????????<li>魏嬰</li>????????????????<li>藍忘機</li>????????????</ul>????????</li>????????<li>慕課網????????????<ul?class="faker">????????????????<li>html</li>????????????????<li>css</li>????????????????<li>javascript????????????????????<ul?class="alex">????????????????????????<li>亞索</li>????????????????????????<li>嘉文四世</li>????????????????????????<li>泰隆</li>????????????????????</ul>????????????????</li>????????????</ul>????????</li>
????????<li>編程達人????????????<ul?class="faker">????????????????<li>馬化騰</li>????????????????<li>李彥宏</li>????????????????<li>馬云</li>????????????</ul>????????</li>????</ul></body></html>

同學試試看這個,照著你的代碼改的

0 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消

請幫我看下,為什么我的鼠標滑到一級菜單,二級三級菜單都會顯示,我想實現鼠標滑到二級菜單的時候,三級菜單才會顯示

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號