• 手机版

    扫码体验手机版

  • 微信公众号

    扫码关注公众号

国内首家协议开发

软芯音视解码保护平台

在线
客服

发布
需求

在线
聊天

天盟
APP

天盟APP下载

关注
微信

微信扫一扫访问
顶部

2-10 作业,body下方为何出现大片空白?如何去除?

CSS布局
   
*{margin: 0;padding: 0; border: 0;}
body{margin: 0;padding: 0; border: 0;}

a{text-decoration: none;}

a:link{color:white;text-decoration:none;}
a:visited{color:white;text-decoration:none;}
a:hover{color:white;text-decoration:none;}
a:active{color:white;text-decoration:none;}

.header{width: 1275px;
        height:64px;
        background-color: #07cbc9;
        margin: 0 auto;}


.logo{padding-top: 6px;
      padding-bottom: 6px;
      padding-left: 60px;
      float: left;
}

.menu{width: 450px;
      height:60px;
      float: right;
      text-align: center;
      padding-right: 40px;



      }

.menu li{display: inline;
         list-style: none;
         font-size:12px;
         color: #ffffff;
         line-height:60px;
         padding: 25px 8px;



}   

.menu li:hover{background: #000;

               }


.banner{ width: 1275;
                  position: relative;
                  height: auto;}


.banner img{display: block;
            width: 1275px;
            height: 600px;
            margin: 0 auto;
}  

.layer{width: 1275px;
       height: 600px;
       margin: 0 auto;
       background: black;
       opacity: 0.5;
       z-index: 1;
       position: relative;
       top: -600px;
       left:0px;}




.form {width: 380px;
                height: auto;
                margin: 0 auto;
                position: absolute;
                top: 200px;
                left: 38%;
                color: #ddd;
                z-index: 2;

                 }  

.form input,textarea{display: block;
                     width: 350px;
                     height: auto;
                     z-index: 2;
                     padding: 10px;
                     margin-top: 15px;
                     border: 1px solid gray;
                     background: transparent;
                     color: #ddd;

                 }  

body{overflow: hidde}

.form textarea{height: 50px;
}

.form .sb{width: 110px;
          text-align: center;
          margin-left: 120px;
          }
        
.form input:hover{border: solid 1px #07cbc9;}
.form textarea:hover{border: solid 1px #07cbc9;}
.form .sb:hover{background:#07cbc9; cursor: pointer; }

.about{width: 700px;
       height: 100%
       margin:0 auto;}

   



   


   
        

                
  • HOME
                
  • ABOUT
                
  • GALLERY
                
  • FACULTY
                
  • EVENTS
                
  • CONTACT
            

   










   
   
   
   
     




ABOUT
  
-

Lorem Ipsum is simply dummy text of the printing and typesetting
industry.Lorem Ipsum is simply dummy
text ever since the 1500s.

免责声明:本内容仅代表回答会员见解不代表天盟观点,请谨慎对待。

版权声明:作者保留权利,不代表天盟立场。

使用道具 举报

全部参与1

你的 .layer 是相对定位 是针对页面自身位置进行定位 你把.layer 下的  
top:-600px;去掉,问题就能看出来了, relative 定位不会使元素脱离文档流 那个白色是.layer在文档流的位置

使用道具 举报

发新帖

发布任务需求已有1031165位用户正在使用天盟网服务

发布分类: *
任务预算: *
需求内容: *
手机号码: *
任务商家报价为
  • 预算价 :
  • 成交价 :
  • 完工期 :
  • 质保期 :

* 最终任务项目以服务商报价、双方协商为准!