CSS怎么让子元素叠在父元素的下面？z-index无效。
demo如上，我在li里又嵌了一层ul，绝对定位为什么不能让ul叠在li元素的下面呢？
我想让子元素叠在父元素下面，达到一个选项卡的效果该怎么做？
展开
收起
1
条回答
写回答
写回答
-
IT从业父级position：relative; z-index:0;
子级position: absolute; z-index:-1;<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style type="text/css"> ul { float: left; } ul li { list-style: none; margin: 7px 20px 6px 0; float: left; position: relative; cursor: pointer; background: $fff; z-index: 999; } ul li span{ height: 20px; padding: 0 5px; line-height: 20px; display:inline-block; background:#fff; border: #555 1px solid; } ul li:hover .sub-ul { display: block; } ul li .sub-ul { position: absolute; width: 180px; left: 0px; border: red 1px solid; background: #fff; display: none; z-index: -1; top:10px; } ul li .sub-ul li { border: none; height: 23px; margin: 0px; line-height: 23px; float: left; } </style> <body> <ul> <li><span>手机</span> <ul class="sub-ul cl"> <li>智能机</li> <li>功能机</li> <li>对讲机</li> </ul> </li> </ul> </body> </html>这样不就在父元素下面了
2019-07-17 19:33:24赞同 展开评论 打赏
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
相关问答
