标签：水平居中

图片在DIV中垂直、水平居中

2008-08-12 10:33:331697 点击
0 评论

将div的line-height设置与div高度一样，配合text-align:center，可实现在IE中内容垂直水平居中显示。示例如下：

CSS：

  1. <style type="text/css">  
  2. .ccdiv {    
  3.   float: left;    
  4.   text-align: center;    
  5.   width: 200px;    
  6.   height: 200px;    
  7.   margin: 5px;    
  8.   border: #ccc 1px solid;    
  9.   line-height: 200px;    
  10.   }  
  11. .ccdiv img {    
  12.   border:#666 1px dotted;  
  13.   }   
  14. </style> 

阅读全文…

技术新知 DIV，CSS，HTML，水平居中，垂直居中

DIV+CSS 水平垂直居中显示

2008-08-11 20:08:118466 点击
1 评论

DIV水平居中显示：

定义div宽度后，设置{margin-left: auto; margin-right: auto;} 即可实现div水平居中，代码示例：

CSS：

  1. <style>  
  2. .cdiv {  
  3. width:200px;  
  4. margin-left:auto;  
  5. margin-right:auto;  
  6. }  
  7. </style> 

 HTML：

  1. <div class="cdiv">fufuok.com</div> 

阅读全文…

技术新知 HTML，DIV，CSS，水平居中，垂直居中