本人遇到的问题案例
网站的header和内容分属两个组件
导航部分属于header组件,轮播部分属于内容组件,通过导航切换内容组件。
可以看到思学行动态有下拉样式
但是本人之前遇到了不论怎么设置下拉层的层级都无效,被内容组件的层级覆盖无法正确展示。
解决方案。
1、在body样式中添加position:relative;
2、在header容器样式中position:absolute;
3、在内容组件的容器样式中position:absolute;
这样做的目的在于将两个组件置于同等优先级的定位,此时给两个绝对定位的组件元素设置对应的zIndex属性就可以控制到想要控制的组件层级了。