English 中文(简体)
div 背景图像在E6和7中明显消失。
原标题:div background image appear nicely in Firefox, disappear in IE6 & 7

我确实是新到超文本/特别安全局的,但有些人却决定用960格迪系统开车,我认为这是有用的。 我知道一些人说,这是不寻常的,但我已经介入,最后,我卷入了上述问题。 我曾尝试过几部法律,如过度流通:隐蔽的、过度的:汽车、显示器、块等,我在其他网页和网页上看到这些守则,但仍然存在错误。

我真的希望能在此现场帮助任何人。

这些地点为:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="content-type" content=
    "text/html; charset=us-ascii">
    <meta http-equiv="content-type" content=
    "text/html; charset=us-ascii">
    <base>
    <title>
      najibahabakar.com
    </title>
    <link rel="stylesheet" href="style.css" type="text/css"
    media="screen">
    <link rel="stylesheet" href="960.css" type="text/css" media=
    "screen">
    <link rel="stylesheet" href="text.css" type="text/css" media=
    "screen">
  </head>
  <body>
    <div class="container_12">
      <div id="topgrafik">
        <div class="prefix_6">
          <ul id="nav" class="nav">
            <li>Laman Depan
            </li>
            <li>Mengenai
            </li>
            <li>Mimpi
            </li>
            <li>Hubungi
            </li>
          </ul>
        </div>
        <div class="clear"></div>
        <div class="grid_3 prefix_1" id="tgfocus">
          <img class="frame" src="images/mengkuang.jpg" alt=
          "tikar mengkuang!">
        </div>
        <div class="clear"></div>
        <div class="center">
          <div class="grid_4">
            <h5>
              Buku, Sastera, Diri
            </h5>
          </div>
          <div class="grid_4">
            <h5>
              Galeri
            </h5>
          </div>
          <div class="grid_4">
            <h5>
              Web Design
            </h5>
          </div>
        </div>
      </div>
      <div class="clear"></div>
      <div id="middlebody">
        <div class="left">
          <div class="grid_2 prefix_1">
            <p id="date">
              31 DISEMBER 2009
            </p>
            <p>
              Buku, kemuncak peradaban
            </p>
            <hr>
            <p id="date">
              31 DISEMBER 2009
            </p>
            <p>
              Cemas bila buku bertambah!
            </p>
            <hr>
            <p id="date">
              31 DISEMBER 2009
            </p>
            <p>
              Janji tak terpenuh
            </p>
          </div>
          <div class="grid_4 prefix_1">
            <p>
              Di sini galeri imej, mungkin juga hasil-hasil kerja
              Photoshop & Inkscape
            </p>
            <hr>
          </div>
          <div class="grid_2 prefix_1">
            <p id="date">
              31 DISEMBER 2009
            </p>
            <p>
              Hasil pertama
            </p>
            <hr>
          </div>
        </div>
      </div>
      <div id="footer"></div>
    </div>
  </body>
</html>

并且:

html {
    background: url( images/bground.jpg ) repeat;
    color: #333333;
}
body,h1,h2,h3,h4,h5,h6 {
    padding: 0;
    margin: 0;
}

/*----------NAVIGATION--------------------*/

#nav li {
list-style-type: none;
display: inline;
}

ul.nav {
margin-top: 2px;
}

/*----------------GENERAL CLASSES------------*/

.center {
text-align: center;
align: center;
padding-left: 10px;
}

.left {
text-align: left;
font-size: 95%;
padding-left: 15px;
}

#date {
font-size: 85%;
}

/*-----------------BACKGROUND-----------------*/

#topgrafik {
background: url( images/topgrafik.jpg ) center top; 
height: 426px;
width: 993px;
float: left;
position: relative;
}

#middlebody {
background: url( images/kandungan2.jpg ) center bottom repeat-y; 
height: 408px;
width: 993px;
float: left;
position: relative;
}

#footer {
background: url( images/footer.jpg ) center bottom; 
background-repeat: no-repeat;
height: 228px;
width: 993px;
float: left;
position: relative;
}

/*---------------CONTENT LAYOUT---------------------*/

#tgfocus {
margin-top: 80px;
margin-bottom: 40px;
position: relative;
min-height: 205px;
}

/*------------------IMAGES AND THUMBNAIL GALLERY-----------*/

.frame { 
padding: 10px; 
border: 1px solid #333300;
height: 190px;
width: 150px;
background-color: #eaede0;
position: absolute;
}
.align-right { 
float:right; 
margin: 0 0 15px 15px; 
}
.align-left { 
float:left; margin: 0 15px 15px 0; 
}

加上960套格里德系统(便于参考):

.container_12,.container_16{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16{display:inline;float:left;position:relative;margin-left:10px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{width:340px}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}.container_12 .push_3,.container_16 .push_4{left:240px}.container_12 .push_6,.container_16 .push_8{left:480px}.container_12 .push_9,.container_16 .push_12{left:720px}.container_12 .push_1{left:80px}.container_12 .push_2{left:160px}.container_12 .push_4{left:320px}.container_12 .push_5{left:400px}.container_12 .push_7{left:560px}.container_12 .push_8{left:640px}.container_12 .push_10{left:800px}.container_12 .push_11{left:880px}.container_16 .push_1{left:60px}.container_16 .push_2{left:120px}.container_16 .push_3{left:180px}.container_16 .push_5{left:300px}.container_16 .push_6{left:360px}.container_16 .push_7{left:420px}.container_16 .push_9{left:540px}.container_16 .push_10{left:600px}.container_16 .push_11{left:660px}.container_16 .push_13{left:780px}.container_16 .push_14{left:840px}.container_16 .push_15{left:900px}.container_12 .pull_3,.container_16 .pull_4{left:-240px}.container_12 .pull_6,.container_16 .pull_8{left:-480px}.container_12 .pull_9,.container_16 .pull_12{left:-720px}.container_12 .pull_1{left:-80px}.container_12 .pull_2{left:-160px}.container_12 .pull_4{left:-320px}.container_12 .pull_5{left:-400px}.container_12 .pull_7{left:-560px}.container_12 .pull_8{left:-640px}.container_12 .pull_10{left:-800px}.container_12 .pull_11{left:-880px}.container_16 .pull_1{left:-60px}.container_16 .pull_2{left:-120px}.container_16 .pull_3{left:-180px}.container_16 .pull_5{left:-300px}.container_16 .pull_6{left:-360px}.container_16 .pull_7{left:-420px}.container_16 .pull_9{left:-540px}.container_16 .pull_10{left:-600px}.container_16 .pull_11{left:-660px}.container_16 .pull_13{left:-780px}.container_16 .pull_14{left:-840px}.container_16 .pull_15{left:-900px}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:   ;display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}* html .clearfix,*:first-child+html .clearfix{zoom:1}

三个小区的所有背景图象都消失了。

请事先帮助和感谢你。

问题回答

我认为,问题在于形象道路上的最后一点点:

./images/footer.jpg/

我不相信,但也许也许会引起问题。 你们可以描述一种相对的生活方式。

images/footer.jpg

你们是否试图去除影像中的拖 trail?

与此类似:

background: url( images/topgrafik.jpg ) center top;




相关问题
Image rendered with wrong colors in IE8

I have a gradient image as a PNG (no transparency) in a web-page. By taking a screenshot of Chrome showing the page and cropping the image from the page, I see the exact same colors are drawn as the ...

Determine Mobile Internet Explorer version

I need to determine the version of Mobile Internet Explorer on a Windows Mobile 6.1 device. So that I can report the same user-agent string as is being used by Mobile Internet Explorer. The user-...

CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

Internet Explorer only part loading JavaScript/CSS

I m having trouble with my local development environment where IE (6 through to 8) is only part loading JavaScript/CSS files. It throws random errors at random places in jquery.min.js every time I ...

IE doesn t run Javascript when you click back button

I ve built a shop with tons of JS running. One of the pieces of the cart, is a zip code field which is required to calculate shipping cost. This works fine going through the cart. Now clicking ...

热门标签