居中

1.居中设置

其中margin-left:-200px;=width/2   margin-top:-100px;=height/2

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>上下垂直居中 在线演示 DIVCSS5</title> 
<style> 
#main {position: absolute;width:400px;height:200px;left:50%;top:50%; 
margin-left:-200px;margin-top:-100px;border:1px solid #00F} 
/*css注释:为了方便截图,对CSS代码进行换行*/ 
</style> 
<body> 
<div id="main">DIV水平居中和上下垂直居中</div> 
</body> 
</html> 

   

  

2.水平居中

margin:0px auto;

text-align:center;

align:center

 vertical-align:middle;

 

posted @ 2016-02-27 12:50  白色的回忆  阅读(142)  评论(0编辑  收藏  举报