CSS奇怪:一些属性没有被解释

时间:2011-10-08 18:43:06

标签: css

问题是在我的网站http://dev.gratefulhearttherapy.org/上,至少有2个css属性未按预期显示:

html {
  background: #fff url('images/bg-top-honey-v3.0.jpg') top center repeat-x !important;
}

#bd img {
  margin: 0; 
  padding: 4px; 
  border: solid 1px #D9D9D9;
}

缺少一张背景图片,图片没有他们应该拥有的灰色边框。

昨天晚上我在代码中弄乱了3件事:

  1. css文件typography-new2.css,
  2. PHP文件元素meta.php,header.php,footer.php和
  3. Google Analytics代码。
  4. 我一定是打破了什么,但我找不到什么。我试图通过W3C验证器传递网站和CSS,我用Chrome检查员仔细检查代码,寻找未封闭的标签等,但没有找到任何东西。

    使用Chrome检查器时,要查看html元素和img,缺少的css似乎不存在 - 不仅被覆盖,而且缺席。

    任何帮助将不胜感激!非常感激。

2 个答案:

答案 0 :(得分:1)

问题出在您的样式表中: typography-new2.css

背景未显示:

在最顶部,您在img之前引用了html,仅以评论分隔。因此,html规则实际上被解释为img html {

img /* REMOVE THIS LINE*/

/* @import url('http://dev.gratefulhearttherapy.org/themes/gratefulheart/tabs.css'); */
/* All CSS files above will be loaded from this single document. */

html {
    margin: 0; 
    padding: 0; 
    /* background: #fff; #f9dc91 url(http://dev.gratefulhearttherapy.org/themes/gratefulheart/images/background-sandish-tile.jpg) !important; */ /* #F9D984; */ /* customize_background_color */
    background: #fff url('http://dev.gratefulhearttherapy.org/themes/gratefulheart/images/bg-top-honey-v3.0.jpg') top center repeat-x !important;
}

图片缺少灰色边框:

在规则*之前,您在结束评论/之外有一行#bd img,这可能是该规则未被应用的原因。

/********************************
*********************************
*       $$ GENERAL TYPES 
********************************/
******************************** /* REMOVE THIS LINE */

#bd img {
    margin: 0;
    padding: 4px;
    border: solid 1px #D9D9D9;
}

如果你删除这两行,我认为你的所有问题都应该解决。

答案 1 :(得分:0)

你的图片不是#bd的直接后代,我认为你的问题是CSS代码没问题。请参阅@ 150poundsofdonamites对另一个问题的回复。

如果仍然无法产生所需的结果,请尝试将html更改为body。