[問題] 關於css子選單繼承母選單寫法
小弟最近有發問過但是都找不到相關類似答案
就是
小弟製作下拉式選單
>a
> a1
> a2
>b
製作大致要像這樣
但
在html中語法
<div class=abc>
<div class=abc1>
<ul class="abc m1">
<li>a</li>
<li>b</li>
</ul>
<div class=abc2>
<ul class="abc m2">
<li>a1</li>
<li>a2</li>
</ul>
</div>
</div>
</div>
由於html已經是固定形式
沒辦法改變
想要藉由css去改
想到繼承的方式
但不曉得該如何寫出css繼承的寫法
用> 還是其他的語法呢
小弟有試著寫過
.abc1 > .abc2 .m2{
border-left: 5px solid #777;
max-height: 0;
transition: max-height .5s ease-out;
overflow: hidden;
}
.abc1:hover > .abc2 .m2 {
max-height: 3rem;
overflow: visible;
}
這樣滑鼠經過a時確實會顯示a1和a2
不過這樣滑鼠經過b也會顯示...
不曉得我要怎修改或寫繼承
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 122.146.85.149
※ 文章網址: http://www.ptt.cc/bbs/Web_Design/M.1414119160.A.92F.html
→
10/24 10:56, , 1F
10/24 10:56, 1F
→
10/24 11:13, , 2F
10/24 11:13, 2F
※ 編輯: ntu203 (122.146.85.149), 10/24/2014 11:23:53
→
10/24 11:41, , 3F
10/24 11:41, 3F
→
10/24 12:33, , 4F
10/24 12:33, 4F
→
10/24 12:42, , 5F
10/24 12:42, 5F
→
10/24 12:42, , 6F
10/24 12:42, 6F
→
10/24 14:43, , 7F
10/24 14:43, 7F
→
10/26 19:07, , 8F
10/26 19:07, 8F