Question

我无法在IE8中完成一些样式。这个项目最初不是AS跨浏览器启用回到IE8但现在必须是，所以我试图在这个网站上对这个CSS进行必要的更改。

这是网站的第一页分区，主页部分顶部带有徽标和注册框。此部分的CSS如下所示：

#page-div-home{
    height:auto;
    background:url('../img/_Pics/bg.png') 50% 40%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: fixed;

    .logo{
        width:100%;
        max-width:1000px;
        height:300px;
        margin-top:100px;
        display:inline-block;

        background:url('../img/_Logos/eSchoolLogo.png');
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: fixed;
    }

}

它还有两个半页面的媒体查询，如下所示：

.sub-wrap{
width:100%;
max-width:1500px;
display:inline-block;
text-align:center;

@media screen and (max-width: 1340px){
    width:90%;
}

.sub-half{ //for FAQ section
    width:50%;
    height:auto;
    float:left;
    text-align:left; //a fix for the .sub-wrap text-align:center, all the FA
    padding:10px;

    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    -o-box-sizing:border-box;

    @media screen and (max-width: 1340px){
        display:block;
        float:none;
        width:1000px;
        margin:0 auto;

        ul{
            padding:0;//this allows the <li>, when they are stacked, to take up full width of ul
        }
    }//media query(1340)

    @media screen and (max-width: 1125px){
        width:700px;
    }//media query(1125)

    @media screen and (max-width: 810px){
        width:100%;
    }

}//.sub-half

我不确定所使用的所有属性究竟是什么让IE8错误地渲染页面（我想它正在为其标准正确渲染）但我想学习如何解决这些问题。错误。我还有<header>和<nav>标记，这些标记在position:fixed;的顶级菜单中用于永不滚动..无论如何，任何帮助都表示赞赏。

Answer 1

您可以尝试在HTML代码的head部分添加以下内容：

<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

Answer 2

默认情况下，IE8不支持media queries。要在IE8上运行媒体查询，请使用Modernizr

Answer 3

当你使用html5标签时，必须用JS向DOM添加新闻元素（nav，heather，footer ..）：

document.createElement("nav");

或者尝试选择@BuddhistBeast更好

使这个CSS在IE8中工作

3 个答案: