Home > Web Front-end > HTML Tutorial > IE6和IE7下浮动层被挡着了_html/css_WEB-ITnose

IE6和IE7下浮动层被挡着了_html/css_WEB-ITnose

WBOY
Release: 2016-06-21 09:34:13
Original
867 people have browsed it

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">.ceshi{	width:204px;	height:204px;	float:left;	}.ceshi a{	width:200px;	height:200px;	display:block;	border:2px #efefef solid;	position:relative;	z-index:10;	}.ceshi a .box1{	width:200px;	height:200px;	overflow:hidden;	background-color:#03C;	}.ceshi a:hover{	border:none;	}.ceshi a .box2{	display:none;	}.ceshi a:hover .box2{	width:300px;	height:300px;	overflow:hidden;	display:block;	background-color:#bf0000;	position:absolute;	top:-50px;	left:-50px;	z-index:9999;	}</style></head><body><div class="ceshi"><a href="#"><div class="box1"></div><div class="box2"></div></a></div><div class="ceshi"><a href="#"><div class="box1"></div><div class="box2"></div></a></div></body></html>
Copy after login


鼠标移到左边,弹出的box2被右边挡住了,
加了z-index:9999;也没有用,

注意position:relative;必须加在.ceshi a上,
不能加在.ceshi a:hover上

求指点,谢谢


回复讨论(解决方案)

楼主参考下

http://topic.csdn.net/u/20110610/21/9c6b45c9-07e1-4263-a89d-4322c874d82f.html

http://www.andymao.com/andy/post/69.html

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template