居中的效果 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>居中的问题</title>
	<style>
       
          .dv1 {
                 width:300px;
                 height:300px;
                 background-color: red;
                position: fixed;
           left:50%;    // 百分之五十      
           top:50%;     // 百分之五十
           margin-left:-150px;      //  负一半
           margin-top:-150px;         // 负一半
          }


	</style>
</head>
<body>
	<div class="dv1"></div>
</body>
</html>

　　

posted @ 2018-04-11 17:37  黑发不知勤学早  阅读(204)  评论(0)    收藏  举报