div 垂直居中完美解决办法

2013-03-18 浏览:1471
div 垂直居中完美解决办法
评论:(0)复制地址

 

  1. html,body{   
  2.     height:100%;   
  3.   margin:0;   
  4.  padding:0;   
  5. }   
  6. body{   
  7.   background:#eae7d7 url(images/vert-centre.jpg) repeat-x center center;   
  8.     text-align:center;   
  9.     min-width:626px;   
  10.   min-height:400px;   
  11. }   
  12. #vert-hoz{   
  13.   position:absolute;   
  14.     top:50%;   
  15.   left:50%;   
  16.  margin-top:-198px;/* half elements height*/  
  17.    margin-left:-313px;/* half elements width*/  
  18.    width:624px;   
  19.   height:394px;   
  20.  border:1px solid silver;   
  21.   background:#666;   
  22.   overflow:auto;/* allow content to scroll inside element */  
  23.     text-align:left;   
  24. }   
  25. h1 {color:#fff;margin:0;padding:0}  
view plaincopy to clipboardprint?
  1. <div id="vert-hoz">  
  2.  <h1>Content goes here</h1>  
  3. </div>  
评论:(0)复制地址
发布:苗景云 | 分类:IT技术&设计 | Tags:Div CSS
上一篇：使用虾米音乐API 搜索音乐 下一篇：加加米自动刷分插件

相关文章

通过CSS截取文字长度2023-01-02

display:inline-block 水平居中无效的解决办法2019-03-07

CSS中font-family：中文字体的英文名称 2018-11-06

css3 nth-child选择器2018-11-04

CSS3 transform多种组合2018-10-26

scrollbar CSS美化（仿Safari样式）2013-10-28

CSS样式在IE6中失效的解决方案2013-05-06

Firefox及Chrome中div不撑高的解决办法2013-04-30

chrome margin失效的解决办法2013-04-19

使用css调整文字间距2013-04-10

发表评论:

◎欢迎参与讨论，请在这里发表您的看法、交流您的观点。