CSS div水平垂直居中和div置于底部

来源:互联网 发布:淘宝外卖和口碑的区别 编辑:程序博客网 时间:2024/05/22 11:50

一、水平居中

[html] view plain copy
 print?
  1. .hor_center {  
  2.         margin: 0 auto;  
  3. }  

二、水平垂直居中

<div class="content"></div>

[html] view plain copy
 print?
  1. .content {  
  2.       width: 360px;  
  3.       height: 240px;  
  4. }  
  5. .ver_hor_center {  
  6.       position: absolute;  
  7.       top: 50%;  
  8.       left: 50%;  
  9.       margin-left: -180px; /*要居中的div的宽度的一半*/  
  10.       margin-top: -120px; /*要居中的div的高度的一半*/  
  11. }  

三、div置于底部(footer)

[html] view plain copy
 print?
  1. .bottom_footer {  
  2.        position: fixed; /*or前面的是absolute就可以用*/  
  3.        bottom: 0px;  
  4. }