javascript - 当这些样式移入 .CSS 文件时，直接应用于元素的样式将丢失

Question

从这里开始:

    <div class="mainContent" style="color:white; overflow-y: auto; position:fixed; top:210px; bottom:60px;">
        <div class="linkContent" id="contentAboutUs"        style="display:none"></div>
        <div class="linkContent" id="contentAboutUsOmni"    style="display:none"></div>
        <div class="linkContent" id="contentAboutUsVerify"  style="display:none"></div>
        <div class="linkContent" id="contentAboutUsSelf"    style="display:none"></div>
        <div class="linkContent" id="contentAboutUsHow"     style="display:none"></div>
    </div>

以及这个 .css 文件内容:

.mainContent {

    width: 850px; 
    xmargin-left:1%;
    border: 1px solid silver; 
    background:transparent url(../images/mainContentOverlay.png);

    -moz-border-radius:     6px;
    -webkit-border-radius:  6px;
    -khtml-border-radius:   6px;
    border-radius:          6px;

}

一切都很好。

但是当我将样式直接应用到 DIV 并将其移动到 .css 文件中(并从 div 中删除样式属性)时，表单会变得困惑。

而且，是的，我在顶部:

<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>

... 以及它提供的所有其他 样式也工作得很好。

知道哪里出了问题吗？

我已经看过这个，但没有成功: Why do CSS styles only take affect when placed in a style tag in my form and not in the associated CSS file?

编辑:

人们要求“后代码”进行比较。我最初没有包括它，因为它看起来很容易可视化结果。但这是 AFTER 版本:

    <div class="mainContent">
        <div class="linkContent" id="contentAboutUs"        style="display:none"></div>
        <div class="linkContent" id="contentAboutUsOmni"    style="display:none"></div>
        <div class="linkContent" id="contentAboutUsVerify"  style="display:none"></div>
        <div class="linkContent" id="contentAboutUsSelf"    style="display:none"></div>
        <div class="linkContent" id="contentAboutUsHow"     style="display:none"></div>
    </div>


.mainContent {

    color:white; overflow-y: auto; position:fixed; top:210px; bottom:60px;
    width: 850px; 
    xmargin-left:1%;
    border: 1px solid silver; 
    background:transparent url(../images/mainContentOverlay.png);

    -moz-border-radius:     6px;
    -webkit-border-radius:  6px;
    -khtml-border-radius:   6px;
    border-radius:          6px;

}

Answer 1

xmargin-left 不是 css 属性。可能是渲染引擎命中它，不知道如何处理它，并停止渲染它下面的任何 css。

可能是打字错误，应该是margin-left ?

如果你试图将其注释掉，请使用正确的 css 注释语法

/* comments here */