0

无法弄清楚我的所有其他移动设备媒体查询都验证了我的最后一个错误，我似乎无法在任何地方找到答案。我已经坚持了一段时间。不确定如何修复它，这是我第一次使用媒体查询，我使用 1140 网格和 html5 任何想法如何让它验证。 

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    background:url(../images/background.jpg);
    margin-left:auto;
    margin-right:auto;
    }

    p {
        font-family:Arial, Helvetica, sans-serif;
        font-size:18px;
    }


    h2 {

        font-family:Arial, Helvetica, sans-serif;
        font-size:24px;
        font-weight:bold;
        color:#000;
    }

    h4 {
        font-size:18px;
    }

    h3 {
        font-size:16px;
    }

    .hidden {
        display: none;
    }


        header nav {
        float:right;
        width:670px;
        height:70px;
        margin-top: 47px;
        font-family: Arial, Helvetica, sans-serif;
        background-image: url(../images/nav_bar.png);
        background-repeat:no-repeat;
    }

    nav ul li {
        float: left;
        cursor: pointer;
        list-style-type: none;
        padding-top:20px;
        padding-left:40px;
        text-align: left;
    }

    nav ul {

        font:Arial, Helvetica, sans-serif;
        font-size:24px;
        color:#FFF;
    }

nav ul li a {
    color: #FFF;
    text-decoration: none;
    }

    .logo {
        margin-top:87px;
    }

    .lineone {
        background:#000;
        height:5px;
        width:891px;
        float:right;
        margin-top:30px;
    }

    /*----Home----*/

    .photos {
        width:1140px;
        margin-left:55px;;
        margin-top:40px;
    }

    .about {
        margin-top:50px;
        margin-left:35px;
    }

    .linetwo {
        background:#000;
        height:5px;
        width:1102px;
        margin-left:35px;
        margin-top:10px;
    }


    .contenthome {
        margin-left:56px;
        margin-top:20px;
    }


/*----info-----*/

.lineinfo{
        background:#000;
        height:3px;
        width:625px;
}

#mainContent {
    margin-top:45px;    
}

#mainContent h2 {
    margin-top:50px;

}

#mainContent p {
    font-family:Arial, Helvetica, sans-serif;
    font-weight:lighter;
    font-size:18px; 
}

#mainImage{
    margin-top:40px;
    margin-left:20px;

}

.footer {
    background-image:url(../images/footer.png);
    background-repeat:no-repeat;
    float:left;
    padding-bottom:200px;
    height:100px;
    width:1129px;
    margin-top:182px;
}
.footer h3 {
    margin-left: auto;
    margin-right:auto;
    text-align:center;
    padding-top:43px;
}







/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */


@media handheld, only screen and (max-width: 990px) {
    .lineinfo {
        width:90%;
    }
}

@media handheld, only screen and (max-width: 900px) {
    .logo{
        margin-top:130px;

    }

    .lineinfo {
        width:90%;
    }

}



@media handheld, only screen and (max-width: 767px) {

    .logo {
        margin-top:20px;
        width:90%;
        height:90%;
        margin-left:auto;
        margin-right:auto;
    }



    header nav {
        float:none;
        margin: 20px;
        margin-right:auto;
        margin-left:auto;
        margin-bottom:0px;
        width:300px;


}

    header nav ul li {
        margin:auto;
        height:10px;
        padding-right:20px;
        font-size:16px; 
        }


    .photos {
        width:75%;

}

#mainImage {
margin-right:auto;
margin-left:auto;

}
.lineinfo {
        width:90%;
    }

.footer {
    width:90%;

    background-image:url(../images/footer_media.png);

}
.footer h3{
    font-size:.875em;
}

@media handheld, only screen and (max-width: 320px) {


    .logo {
        margin-top:20px;
        margin-left:auto;
        margin-right:auto;
        width:90%;
        }

    header nav {
        float:none;
        margin: 20px;
        margin-right:auto;
        margin-left:auto;
        margin-bottom:0px;
    }


    header nav ul li {
        width:20px;
        font-size:12px;
    }

        .lineinfo {
        width:90%;
    }

    #mainImage {
margin-right:auto;
margin-left:auto;   
}

.footer h3 {
    font-size:.875em;
}
}
4

1 回答 1

1

您在该部分之后错过了结束括号 }：

 @media handheld, only screen and (max-width: 767px) {

就在括号里：

   .footer h3{ 
       font-size:.875em;
    }
 } /* here. */

    @media handheld, only screen and (max-width: 320px) {
于 2012-11-14T06:05:08.543 回答