IE 8网站兼容性问题

Rud*_*haw 4 css html5 internet-explorer-8 web

所以,我创建了一个网站的开头.如果我在Internet Explorer 8或更低版本中运行它,那么与html相关的所有(大部分)样式似乎都会消失.这是我到目前为止检查的内容;

我已经检查了W3C验证检查它运行正常且没有错误,我检查了IE8与HTML5的兼容性,我没有使用任何不兼容的东西.我已经使用IE开发工具更改了浏览器版本的Internet Explorer,它显示css属性已成功与其对应的元素配对,但它们只是没有显示在页面上.所以我已经没有东西可以试试看了.以下是整个网站(它只是很小).

指数;

<!DOCTYPE html>
<html>
  <head>
    <title>Your Indy Buddy</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <meta charset="utf-8">  
  </head>
  <body id="body">
<nav id="titlebar">
    <h1><img src="Other/eve.png" style="float:left;margin-right:200px;" alt="Image Not Displayed"/>EVE ONLINE INDY BUDDY</h1>
    <nav id="utilbar">
        <p style="margin-left:0px;">Your Time:</p>
            <form>
                Email <input type="text" name="email"/>
                 Password <input type="text" name="password"/>
                <button type="button" onclick="">Login</button>
            </form>
        <p style="margin-left:0px;">Eve Time : </p>
    </nav>
    <p>Not registered? Register</p>
</nav>
<br/>
<nav id="main">
    <h2>Test</h2>
</nav>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

style.cs;

/* Reset above occluded */
h1 {font-size:40px;margin-left:10px;margin-bottom:20px;}
p {margin-top:10px;margin-left:10px;}

#body {background-image:url("Other/background.jpg");background-color:#000000;font-family:"Arial Black", Gadget, sans-serif;color:rgb(200,200,200);font-size:14px;}
#main {width:890px;margin:auto;padding:12px;background-color:rgba(145,49,28,0.9);margin-top:180px;}
#titlebar {width:926px;padding-top:10px;padding-bottom:10px;background-color:rgb(24,24,24);position:fixed;left:50%;margin-left:-463px;margin-top:12px;}
#utilbar {width:906px;padding:10px;background-color:rgb(145,49,28)}
#utilbar form {float:right;position:absolute;right:10px;top:85px;}
#utilbar input {font-family:sans-serif;background-color:rgb(180,80,45);border:2px solid rgb(201,113,87);}
#utilbar button {font-family:'Arial Black', Gadget, sans-serif;color:rgb(200,200,200);background-color:rgb(160,60,40);border:2px solid rgb(180,100,70);}
#utilbar button:hover {background-color:rgb(100,30,10);border:2px solid rgb(160,60,30);}
Run Code Online (Sandbox Code Playgroud)

很抱歉将代码转储给你们,但是我已经用尽了一些东西,我坦率地说有点困惑.如果它是IE7及以下只是不起作用,我会忽略它.但是由于某种原因,许多企业仍然在IE8上运行.

Bri*_*ips 8

像Sheikh Heera所说,IE8及以下版本不支持HTML5元素.您需要在代码中包含HTML5填充程序.只需将以下内容粘贴到<head>元素中:

<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
Run Code Online (Sandbox Code Playgroud)

这实质上允许IE6-8支持HTML5元素,如<nav>,<header>,<footer>等.

下面是对HTML5垫片/ SHIV一个漂亮的背景下,如果你很好奇.