（某些）背景图像不会在 IE7 或 IE8 中显示

发布于 2024-12-08 07:51:11 字数 1282 浏览 1 评论 0原文

CSS：

#content {
    width:630px;
 }

.all_friends {

background:url(../img/friends.png) no-repeat;
margin-left:15px;
height:123px;
width:615px;
padding-bottom:20px;
}


.all_awards {
background:url(../img/awards2.png)no-repeat;
height:126px;
width:581px;
padding-bottom:20px;
margin-left:20px;
}

HTML：

<div id=content>
  <h4>Friends</h4>
   <p>Friends description text</p>
   <div class="all_friends"></div> 

  <h4>Awards</h4>
   <p>Awards description text</p>
   <div class="all_awards"></div>
</div>

在IE7/8中，我只是不明白为什么“朋友”内容块中的图像在IE7/8中显示，但在“奖项”内容块中没有图像显示。我不想将奖项图像作为内联“img”标签（因为它在其他内容块中工作），但这是 IE 显示它的唯一方式。有谁知道我该如何解决这个问题？我以前在 IE 中遇到过这个问题，我必须在标记中添加 img 标签，但它在具有相同规则（不包括图像和大小）的一个内容块中工作并且不显示是没有意义的在另一个。我检查了此处和此处，以及此处，我修改了标记，但没有任何效果。

这太疯狂了。你试图将 CSS 和 HTML 分开，有时会浪费大量时间尝试做这些事情，结果却发现它们无法完成......（咆哮）

谢谢！

原文

CSS:

#content {
    width:630px;
 }

.all_friends {

background:url(../img/friends.png) no-repeat;
margin-left:15px;
height:123px;
width:615px;
padding-bottom:20px;
}


.all_awards {
background:url(../img/awards2.png)no-repeat;
height:126px;
width:581px;
padding-bottom:20px;
margin-left:20px;
}

HTML:

<div id=content>
  <h4>Friends</h4>
   <p>Friends description text</p>
   <div class="all_friends"></div> 

  <h4>Awards</h4>
   <p>Awards description text</p>
   <div class="all_awards"></div>
</div>

In IE7/8, I just don't understand why the image in "Friends" content block displays in IE7/8, but there in the "Awards" content block, no image displays. I don't want to put the Awards image as a inline "img" tag, (since it works in the other content block) but that is only way IE will display it. Does anyone know how I can fix this? I've had this problem before in IE and I HAD to add the img tag in the markup, but it doesn't make sense that it works in one content block with the identical rules (exc. image and size) and not show up in the other. I checked here and here, and here, I modified my markup, but nothing is working.

This is crazy. You try to keep your CSS and HTML separate, and sometimes a lot of time is wasted on trying to do these things only to find out that they can not be done.... (rant over)

Thanks!

分享到QQ

分享到微博