2012-06-18 154 views
2

好吧,所以我差不多完成了我的第一个网站。但它似乎并没有在IE中运行良好。它在Firefox和Chrome中运行良好。背景加载但主要问题是图片链接看起来破碎?任何帮助将不胜感激。图像没有显示在IE 9中

我的网站:ngkevin-art.com

CSS:

body { 
    width:auto; 
    height:auto; 
    background-image:url(images/bg_main2.png); 
    background-color:#2d2d2d; 
    background-repeat:no-repeat; 
    background-position:center; 
    margin-top:30px; 
} 


#container { 
    width:1280px; 
    height:960px; 
    margin-left:auto; 
    margin-right:auto; 

} 

#wrapContact { 

    width: 520px; 
    height: 100px; 
    margin-left:735px; 
    margin-top: 10px; 
    clear: both; 
} 

#linked { 
    float:left; 
    margin-top:35px; 
    width: 175px; 
} 

#facebook { 
    float:left; 
    width: 200px; 
    margin-left:32px; 
    margin-top:25px; 

} 

#email { 
    float:left; 
    width:75px; 
    margin-left:35px; 
    margin-top:20px; 

} 

#wrapNav { 

    width: 475px; 
    margin-left:750px; 
    margin-top:60px; 
} 

#wrapCharacters { 

    width: 960px; 
    z-index: 3; 
    margin: 130px auto auto 75px; 
    float:left; 
} 

.turntable { 
    margin: .5% auto auto auto; 

} 

#zanza { 

    float:left; 
} 

#titan { 

    float:left; 
    margin-left: 10px; 
} 

#rockBeast { 

    float:left; 
    margin-left: 10px; 
} 

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Kevin Ng Art Portfolio</title> 
<script type="text/javascript" 
src="http://code.jquery.com/jquery-latest.min.js" charset="utf-8"> 
</script> 
<link rel="stylesheet" type="text/css" href="default3.css"/> 
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script> 
<script type="text/javascript" src="js/jquery.smooth-scroll.min.js"></script> 
<script type="text/javascript" src="js/lightbox.js"></script> 
<link href="lightbox.css" rel="stylesheet" /> 

</head> 

<body> 

<div id="container"> 

     <div id="wrapContact"> 
      <div id="linked"> 
       <a href="http://www.linkedin.com/pub/kevin-ng/25/558/75b"> 
       <img src="images/logo_linked_large.png" width="auto" height="auto" border="0" alt="linkedin_logo" /> </a> 
      </div> 

      <div id="facebook"> 
       <a href="http://www.facebook.com/profile.php?id=1309131548"> 
       <img src="images/logo_fb_large.png" width="auto" height="auto" border="0" alt="facebook_logo" /> </a> 
      </div> 

      <div id="email"> 
       <a href="mailto: [email protected]"> 
       <img src="images/gmail.png" width="auto" height="auto" border="0" alt="email_icon" /> </a> 
      </div> 
     </div> <!-- End "wrapContact"> --> 

     <div id="wrapNav"> 

      <a href="index.html">       
      <img src="images/bg_tab_main.png" width="auto" height="auto" border="0" alt="Main" /> </a> 

      <a href="demo.html">        
      <img src="images/bg_tab_demo.png" width="auto" height="auto" border="0" alt="Demo" /> </a> 

      <a href="about.html">       
      <img src="images/bg_tab_about.png" width="auto" height="auto" border="0" alt="About" /> </a> 

     </div> 
     <!-- End "wrapNav"> --> 

     <div id="wrapAbout"> 

      <div id="picture"> 
       <img src="images/picture.jpg" width="auto" height="auto" alt="picture" /> 
       <div id="text2"> 
        <h2> Me in the middle left, my buddies, Jordan Gabriel on the left and Edmund Zhu on the right, 
         and finally, Epic Games VIP, Cliff Bleszinski! Taken at GDC 2010. </h2> 
       </div> 
      </div> 

      <div class="text">   
       <h1> Resume: <br/> 
       <br/> Email: <br/> <br/> 
       <br/> About Me:</h1>    
      </div> 

      <div class="text3"> 
       <h1> <a href="resume/Kevin Ng Resume2.doc"> Click Here </a> 
       <br/> <br/> <a href="[email protected]"> [email protected] </a> <br/> 
       <br/> <br/> <font size="4"> 
        My desire to be in the game development industry is to work with other individuals that take pride in creating a game, 
        something that can be enjoyed by a multitude of people. There is nothing I would like better than to lend my talents and 
        artistic skills for that purpose. <br/> <br/> 

        I believe the key to creating memorable game art, whether it be characters or environments, is the story. 
        Just like reading a good book or watching a thrilling movie, I loved to be immersed in the world of the game. As a result, 
        I had an affinity to Role-Playing Games. Classic games of my generation such as Chrono Trigger, Final Fantasy, and Zelda 
        showed me a world of endless imagination. <br/> <br/> 

        The characters which are the focal point of the story, their goals and motivations, their trials and tribulations, 
        their victories and defeats... These are the things I think about constantly when I look at them. 
        A character without depth doesn't exist, but if they do, I can only imagine how boring that would be.      
       </font></h1> 
      </div> 

     </div> 

    </div><!-- End "container" --> 

</body> 
</html> 
+0

哪个版本的IE你在说什么? – Shoaib

+0

请选择一个更具描述性的标题。 –

+0

对不起,改变了标题。 – RoninRen

回答

4

就在你的图像,是造成问题的宽度/高度属性。您将宽度和高度设置为“自动”。无论是设定明确的宽度/高度:

<img src="zanza/zanza_portrait_top.png" width="179" height="198" border="0" alt="zanza"> 

或删除width和height属性:

<img src="zanza/zanza_portrait_top.png" border="0" alt="zanza"> 
+0

谢谢,把它修好了! – RoninRen

1

IE是搞乱了图像的宽度和高度。对不起,我无法提供更多帮助,但删除每个图像的高度和宽度元素会使图像显示出来。

+0

是的,它修复了它! – RoninRen

0

请参阅此链接,了解CSS3中的auto属性。基本上,它在该版本中不受支持,所以最好是明确地设置它或者没有属性。

Link

+0

感谢您的链接! – RoninRen