gallery区怎么设置了没用

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

*{
 padding:0;
 margin:0;
}
.header{
 width:100%;
 height:100px;
 background-color:#07cbc9;
 position:fixed;
}
.header img{
 width:260px;
 height:48px;
 padding-left:100px;
 padding-top:26px;
}
.header .logo{
 float:left;
}
.header .nav{
 float:right;
}
.header .nav ul{
 padding-right: 50px;
}
.header .nav ul li{
 float:left;
 list-style: none;
 width:100px;
 height:100px;
 line-height: 100px;
 font-size: 15px;
}
.header .nav ul li a{
 text-decoration: none;
 color:#fff;
}
.header .nav ul li a:hover{
 background-color:#000;
}
.mian .banner{
 width:100%;
 height:800px;
}
.mian .banner img{
 width:100%;
 height:800px;
}
.mian .banner-play{
 position:absolute;
 top:100px;
 left:0;
 background-color:#000;
 width:100%;
 height:800px;
 opacity: 0.5;
}
.mian .banner-play-top{
 width:400px;
 height:300px;
 background-color:#000;
 color:#fff;
 position:absolute;
 top:350px;
 margin-top:-150px;
 z-index: 2;
 right:50%;
 margin-right: -200px;
}
.mian .about{
 width:1000px;
 margin:0 auto;
}
.mian .about .about-top{
 padding-top:100px;
    text-align:center;
} 
.mian .about .about-mid{
 padding-top:20px;
    text-align:center;
}
.mian .about .about-mid img{
 width:400px;
 height:300px;
}
.mian .about .about-bottom{
 width:100%;
 height:400px;
 background-color: #07cbc9;
}
.mian .about .about-bottom tr{
 width:25%;
 height:200px;
}
.mian .about .about-bottom img{
 width:200px;
 height:190px;
}
.mian .gallery{
 width:800px;
 margin:0 auto;
}
.mian .gallery .gallery-top{
 padding-top:100px;
    text-align:center;
}
.footer{
 width: 100%;
 height:100px;
 background-color: #07cbc9;
 color: #fff;
 font-size: 15px;
 font-family:"微软雅黑";
 text-align:center;
 line-height:100px;
 margin-top: 20px;
}

<!DOCTYPE html>
<html>
<head>
     <meta charset="UTF-8">
     <title>网页布局</title>
     <link rel="stylesheet" type="text/css" href="css/index.css">
</head>
<body>
    <!-- 头部 -->
    <div class="header">
        <!-- logo -->
     <div class="logo">
      <img src="images/logo.png" alt="logo"/>
     </div>
        <!-- 导航区 -->
     <div class="nav">
            <ul>
                <li><a href="">HOME</a></li>
                <li><a href="">ABOUT</a></li>
                <li><a href="">GALLERY</a></li>
                <li><a href="">FACULTY</a></li>
                <li><a href="">EVENTS</a></li>
                <li><a href="">CONTACT</a></li>
            </ul>   
        </div>
    </div>
    <!-- 主体 -->
    <div class="mian">
        <div class="banner">
            <img src="images/banner3.jpg">
        </div>
        <!-- 遮罩层 -->
        <div class="banner-play">
            <div class="banner-play-top">
                <form>
                    <input type="text" size="40" value="YOUR NAME"><br/>
                    <input type="text" size="40" value="YOUR PHONE"><br/>
                    <input type="text" size="40" value="YOUR EMAILL"><br/>
                    <textarea name="textarea" cols="45" rows="8"></textarea><br/>
                    <input type="submit" name="submit" value="SEND MISSAGE">
                </form>
            </div>
        </div>
        <div class="about">
            <div class="about-top">
                <h1>ABOUT</h1>
                <p>bsisjx jsok bisjb ihvsghh vxibxyus gishxh hoixsuxhi<br/> hsoijos bxijxni bxishiw bxijowlj ixisnxijxisy <br/>vijnvxijxnx xinxoxmo</p>
            </div>
            <div class="about-mid">
                <img src="images/bb3.jpg"/>
            </div>
            <div class="about-bottom">
                <table>
                    <tr>
                        <td><img src="images/b1.jpg"/></td>
                        <td>111111111</td>
                        <td><img src="images/b2.jpg"/></td>
                        <td>1111111111</td>
                    </tr>
                    <tr>
                        <td>111111111</td>
                        <td><img src="images/b3.jpg"/></td>
                        <td>111111111</td>
                        <td><img src="images/b4.jpg"/></td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="gallery">
            <div class="gallery-top">
                <h1>GALLERY</h1>
                <p>bsisjx jsok bisjb ihvsghh vxibxyus gishxh hoixsuxhi<br/> hsoijos bxijxni bxishiw bxijowlj ixisnxijxisy <br/>vijnvxijxnx xinxoxmo</p>
            </div>
            <div class="gallery-bottom">
                 
            </div>
        </div>
    </div>
    <!-- 底部 -->
    <div class="footer">
        @ 2016 imooc.com 京ICP备13046642号
    </div>
</body>
</html>