老师帮我看一下代码的实现情况，有哪些地方可以优化的？

来源：2-14 编程练习

抓住这只猪

2019-04-27 10:37:55

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
    /*此处写代码*/
    /*全局部分*/
    body,html{
       margin:0;padding: 0;

    }
    .container{
       height: 365px;
       width: 1020px;
        position: absolute;
       top:50%;
       margin-top: -182.5px;
       left: 50%;
       margin-left:-510px;

        }
   img{
    display: block;
   }
   /* 顶部部分*/
    .top{
       background-color: #add8e6;
       height:245px;
       width:1020px;

    }
    .left{
       width: 360px;
       height: 215px;
       float: left;
       margin: 15px 100px;
    }
    .right{
        width: 360px;
       height: 215px;
       float: right;
       margin-top:15px;
       margin-bottom:15px;
       margin-right:100px;
    }
   /* 底部部分*/
   .bottom{
    background-color: #ffb6c1;
       height: 120px;
       width:1020px;

   }
   .pic{

    width: 200px;
    height: 60px;

    margin-top:30px;
margin-bottom: 30px;
   }
.p1{
   float: left;

margin-left:105px;
margin-right:105px;
}
.p2{
   float: left;
}
.p3{
   float: right;
   margin-right:105px;
}
</style>

</head>
<body>


<div class="container">
   
   <div class="top">
       <div class="left">
           <img src="http://climg.mukewang.com/58c0f808000129a303600215.jpg"/>
       </div>
       <div class="right">
           <img src="http://climg.mukewang.com/58c0f819000198a703600214.jpg">
       </div>
   </div>
   
   <div class="bottom">
       <div class="pic p1">
           <img src="http://climg.mukewang.com/58c0f81d0001fe4402000060.jpg">
       </div>
       <div class="pic p2">
           <img src="http://climg.mukewang.com/58c0f8220001dfce02000060.jpg">
       </div>
       <div class="pic p3">
           <img src="http://climg.mukewang.com/58c0f8780001c74602000060.jpg">
       </div>
   </div>
</div>

</body>
</html>