今天实在闲的蛋疼,然后就想着说复习一下html和css,毕竟前面也没咋好好看。然后就照着b站的那个挺好看的小导航,写了一个小导航,大致内容↓:
大致效果 大概这样,但是总结来说,有几个点需要注意下
- 首先我以为必须要JS才能完成的悬浮显示二级菜单,原来直接上html和css也完全ok
- 其次中间卡壳了一段儿,原因是这样:
我把二级菜单的position设置为absolute之后,top值设置的离一级菜单有点远,虽然肉眼看上去勉强ok,但是对于
#nav #list>li:hover .sub-list{ display: block; }
这一段代码就完全行不通了,一旦这个距离过于远,就会默认鼠标离开了一级菜单,二级菜单就完全不见了,这又怎么点?所以后来我去B站测试了一下将二级菜单的top值调大了一些,果然不行了,(重新正视html和css)