关于定位和z-index层叠的问题_html/css_WEB-ITnose

来源：动视网责编：小采时间：2020-11-27 15:59:19

关于定位和z-index层叠的问题_html/css_WEB-ITnose

关于定位和z-index层叠的问题_html/css_WEB-ITnose:使用定位后，z-index有些诡异，不起作用。先上代码CSS： .head_right_pt{ width:68px; height:39px; float:left; cursor:pointer; line-height:38px;font-size:14px;border-right:1px solid #fcfcfc;

推荐度：

点击下载本文 文档为doc格式

导读关于定位和z-index层叠的问题_html/css_WEB-ITnose:使用定位后，z-index有些诡异，不起作用。先上代码CSS： .head_right_pt{ width:68px; height:39px; float:left; cursor:pointer; line-height:38px;font-size:14px;border-right:1px solid #fcfcfc;

使用定位后，z-index有些诡异，不起作用。

先上代码CSS：

.head_right_pt{ width:68px; height:39px; float:left; cursor:pointer; line-height:38px;font-size:14px;border-right:1px solid #fcfcfc; border-left:1px solid #fcfcfc;position:relative }.pt_hover{ border-right:1px solid #4589de; border-left:1px solid #4589de; background:#ffffff; z-index:2; }.pt_out{ }.head_right_pt ul{ margin:0; padding:0; list-style:none; }.pt_box{	width:300px;	height:120px;	overflow:hidden;	background:#fff;	border:1px solid #4589de;	filter:alpha(opacity=90); /*支持 IE 浏览器*/	-moz-opacity:0.90; /*支持 FireFox 浏览器*/	opacity:0.90; /*支持 Chrome, Opera, Safari 等浏览器*/ z-index:3;	position:absolute;	right:-1px;	bottom:-121px;}

HTML代码：

APP
手机
微信

目前需要把微信置于上一层；

置于下一层
单多次试验没有作用

始终占领最顶层。

请指教！

回复讨论(解决方案)

我这里用你的代码测试，它们根本没有重叠，为什么分层呢？你是要做选项卡对吧！？

一样的。我需要div盖住下面 LI pt_box一个像素的位置所以还是要有次序层叠。

但是怎么设置，pt_box都在对应diiv的上面，没有出效果。

是不是ul标签的问题！
要不咱们这样？

和UL没有关系。

简化下代码，更容易看

.head_right_pt{ width:68px; height:39px; float:left; cursor:pointer; line-height:38px;font-size:14px;border-right:1px solid #fcfcfc; border-left:1px solid #fcfcfc;position:relative }.pt_hover{ border-right:1px solid #4589de; border-left:1px solid #4589de; background:#ffffff; z-index:2; }.pt_out{ }.head_right_pt ul{ margin:0; padding:0; list-style:none; }.pt_box{	width:300px;	height:120px;	overflow:hidden;	background:#fff;	border:1px solid #4589de;	filter:alpha(opacity=90); /*支持 IE 浏览器*/	-moz-opacity:0.90; /*支持 FireFox 浏览器*/	opacity:0.90; /*支持 Chrome, Opera, Safari 等浏览器*/ z-index:3;	position:absolute;	right:-1px;	bottom:-51px;}

微信

层叠问题已经解决。只需要把显示的拿出来成新div

但是定位IE和FF有较大相差，如何解决

关于定位和z-index层叠的问题_html/css_WEB-ITnose

推荐度：

点击下载本文 文档为doc格式

标签：定位 html html的

热门焦点

关于定位和z-index层叠的问题_html/css_WEB-ITnose

关于定位和z-index层叠的问题_html/css_WEB-ITnose

回复讨论(解决方案)

关于定位和z-index层叠的问题_html/css_WEB-ITnose

最新推荐

猜你喜欢

热门推荐