在制作多级菜单的过程中,遇到了一些问题,花费了几天的时间才解决,途中几乎都想放弃自学了,但是还是坚持下来了。希望我的经历能帮助到自学的大家;如有前辈指教的话就更好了!
1:效果图:
2.思路:
1.一级菜单 用ul ;
2.二级菜单放 一级菜单的li中;
3.二级菜单用div包裹使用5个 dl;
4.三级菜单放二级菜单的dd 中;
5.三级菜单同样使用dl;
3.碰到的问题:
1.二级和三级菜单会把下面的内容(图片展示区)挤到下面去;
2.使用JQurey的hover时候,只要移开一级菜单(全部商品分类)二级菜单就会消 失;
4.解决方法:
1.使用绝对定位,让二级和三级脱落文档流,就不会影响下面的内容(图片展示区);
2.
A)当出现这个问题的第一反应就是给二级父元素加相对定位,我考虑的是绝对定位可能已经不在li的包裹里了。但是还是不行!!!!!!!
B)我又考虑是不是给li设置了高度导致鼠标选不到二级菜单?我又把li的高给去了还是不行!!!!!!
C)度娘了N久,总于发现一篇文章说的是postion会导致z-index默认为0;
一般的都默认为1;顿时醒悟!!!!原来是被图片导航给盖住了。。。。。。SO 给二级 菜单添加z-index:2;然后就行了!!!!
大概是自己的基础不稳,决定去买本CSS权威来看看。!!!!!
以后会继续总结谢谢大家!
2016.5.16 坚持的余
2024 - 快车库 - 我的知识库 重庆启连科技有限公司 渝ICP备16002641号-10
企客连连 表单助手 企服开发 榜单123