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中删除样式attr）时，表单会崩溃成混乱。

而且，是的，我在顶部：

<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?

编辑：

人们已经要求＃34;代码＆＃34;为了比较。我之前没有把它包括起来，因为看起来很容易看到结果。但这是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

您是否将div的内嵌样式放在外部样式表的.mainContent类中？

如果是，可以尝试在父div中使用.mainContent div并将内联样式应用于父div，同时我认为你的.mainContent div中可能有错误，不应该xmargin-left是margin -left？

Answer 2

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

也许是一个错字，应该是margin-left？

如果您要对其进行评论，请使用

的正确css注释语法

/* comments here */

Answer 3

有些观点：

1.在某些情况下，href =＆＃34; css / style.css＆＃34;可以区分大小写，所以如果你的文件是＆＃39; Css / style.css＆＃39; （有资本C）它可能无法运作。尝试查看是否可以在浏览器中访问css / style.css文件。

2.样式和.css文件的修道院取决于放置它们的位置。最新的地方更优先。

如果你做这样的事情：

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

和

   <div class='a_c1css_style  a_c2css_style'></div>
   <div class='a_c2css_style  a_c1css_style'></div>

两个DIV都有相同的结果，因为在页面中的c1.css之后使用了c2.css。

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

3 个答案: