css z-index 失效不好用的解决方法

如果两个div层没有上下区分可以添加 position: relative;试一下

下面介绍设置z-index时必须要固定位置，这样设置它的值时才能奏效（例如 position:absolute;）下面是示例代码，在ff3.5.5和ie5.5~ie8.0RC1中通过，大家可以尝试着不固定其位置试试。

<!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 runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
#king_of_diamonds {
    position: relative;
    background-color:gray;
    width:30px; height:30px;
    left: 145px;
    top: 145px;
}
#ace_of_diamonds {
    position:relative;
    background-color:blue;
    width:300px; height:300px;
    left: 160px;
    top: 130px;
    z-index: 1;
}
        
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div id="king_of_diamonds">
    a
    </div>
    <div id="ace_of_diamonds">
    b
    </div>
    </form>
</body>
</html>

来源：/作者：/更新时间：2012-12-03

顶

踩

javaScript CSS HTML PHP jquery flash教程 seo教程 html5 Ant

css z-index 失效不好用的解决方法

最新文章

新热推荐

文章排行

javaScript CSS HTML PHP jquery flash教程 seo教程 html5 Ant

css z-index 失效 不好用 的解决方法

最新文章

新热推荐

文章排行

css z-index 失效不好用的解决方法