当前位置：首页 → 问答吧 → ie6下z-index的疑问啊啊啊啊啊

ie6下z-index的疑问啊啊啊啊啊

时间：2011-09-29

来源：互联网

<!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"> *{margin:0; padding:0;} .c,.d{width:100px; height:100px; margin:10px;} .e{width:150px; height:150px; position:relative; background:#999;} .b,.d{overflow:hidden; position:relative;} .a{overflow:hidden;zoom:1;background:green; width:200px;} .c{position:absolute; bottom:0;right:-10px;background:red; z-index:2;} .b{background:yellow;} .d{background:blue; z-index:10} </style> </head> <body> <div class="a"> <div class="e"> <div class="b"><div class="d"></div></div> <div class="c"></div> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

目的是让c的层级在b上面，d下面，现在ie6、7有问题，请教大家

作者: devillq 发布时间: 2011-09-29

<!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"> * { margin:0; padding:0; } .c, .d,.b { width:100px; height:100px; margin:10px; } .e { width:150px; height:150px; position:relative; background:#999; } .a, .d { overflow:hidden; zoom:1; position:relative; } .c { position:relative; bottom:80px; left:-10px; } .a { background:green; width:200px; } .b { background:yellow; } .c { background:red; z-index:2; } .d { position:absolute; background:blue; z-index:10 } </style> </head> <body> </head> <body> <div class="a"> <div class="e"> <div class="b"> <div class="d">d</div> </div> <div class="c">c</div> </div> </div> </body> </html>
提示：您可以先修改部分代码再运行

作者: wyysf 发布时间: 2011-09-29

谢谢楼上了，原来把b的position去掉就可以了

作者: devillq 发布时间: 2011-09-29

ie6下z-index的疑问啊啊啊啊啊

热门阅读

热门下载