84669 person learning
152542 person learning
20005 person learning
5487 person learning
7821 person learning
359900 person learning
3350 person learning
180660 person learning
48569 person learning
18603 person learning
40936 person learning
1549 person learning
1183 person learning
32909 person learning
走同样的路,发现不同的人生
根据parent元素ul定位的
//网页源代码,ul的类名为menu .menu { position: relative; width: 170px; padding: 5px 0; line-height: 35px; border-radius: 5px; background: -webkit-linear-gradient(top,#dbdbdb,#999); }
这段css固定位置:
.menu li:nth-child(1):hover ~ .ribbon_wrap{ top: 8px; } .menu li:nth-child(2):hover ~ .ribbon_wrap{ top: 43px; } .menu li:nth-child(3):hover ~ .ribbon_wrap{ top: 78px; } .menu li:nth-child(4):hover ~ .ribbon_wrap{ top: 113px; } .menu li:nth-child(5):hover ~ .ribbon_wrap{ top: 148px; }
这段CSS移动过去:
.ribbon_wrap { position: absolute; top: 8px; left: -20px; z-index: 1; transition: top 0.4s; }
这里的transition让css的top属性在修改时以0.4秒的时间平滑的过渡过去。
根据parent元素ul定位的
这段css固定位置:
这段CSS移动过去:
这里的transition让css的top属性在修改时以0.4秒的时间平滑的过渡过去。