Internet Explorer 6 css order 很重要的错误

也许经过一整天，我在IE6中探索了新的错误(对我来说(。CSS 样式的顺序很重要。该样式仅适用于第一个子项(在 css 文件中，而不是在元素中(。这很难解释，但这些例子会告诉你我的意思。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style>
    #container #p.one
    {
        position: absolute;
        left:50%;
        width: 20px;
        height: 20px;
        background: green;
    }
    #container #p.two
    {
        position: absolute;
        left:50%;
        width: 20px;
        height: 20px;
        background: green;
    }
    #container
    {
        position: absolute;
        z-index: 500;
        width: 100%;
        height: 100%;
    }
    </style>
</head>
<body>
    <div id="container">
        <div id="p" class="one">123</div> <!-- change class "one" with "two" -->
    </div>
</body>

因此，如果将类">

一"更改为类"二"，div 将失去样式。样式一和样式二完全相同。

但是如果你改变：

<div id="p" class="one">

跟

<div id="p" class="two">

并将样式从：

    #container #p.one
    {
        position: absolute;
        left:50%;
        width: 20px;
        height: 20px;
        background: green;
    }
    #container #p.two
    {
        position: absolute;
        left:50%;
        width: 20px;
        height: 20px;
        background: green;
    }
    #container
    {
        position: absolute;
        z-index: 500;
        width: 100%;
        height: 100%;
    }

自：

    #container #p.two
    {
        position: absolute;
        left:50%;
        width: 20px;
        height: 20px;
        background: green;
    }
    #container #p.one
    {
        position: absolute;
        left:50%;
        width: 20px;
        height: 20px;
        background: green;
    }
    #container
    {
        position: absolute;
        z-index: 500;
        width: 100%;
        height: 100%;
    }

只需将类"一"与类"二"交换即可类"两个"将起作用，但"一个"不起作用。如何解决这个问题或不可能？

这是一个已知的IE6错误。它将忽略除第一个之外的所有#id.class。

我不明白你为什么在你的css规则中同时使用ID和类。就其本质而言，ID 可以/应该只引用页面中的一个元素，因此 #p.two 和 #p.one 实际上应该只 #p???

相关内容

最新更新

热门标签：