zoukankan html css js c++ java

CSS解决未知高度垂直居中的问题

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml">    <head>  <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />  <title>无标题 1</title> 
 <style type="text/css"> 
 body {padding: 0; margin: 0;}   
body, html {height: 100%;}   
#outer {height: 100%; overflow: hidden; position: relative; 100%; background:ivory;}   
#outer[id] {display: table; position: static;}   
#middle {position: absolute; top: 50%;} /* for explorer only*/  
#middle[id] {display: table-cell; vertical-align: middle; position: static;}   
#inner {position: relative; top: -50%; 400px;margin: 0 auto;} /* for explorer only */  
div.greenBorder {border: 1px solid green; background-color: ivory;}   
*+html #outer[id] {position: relative;} /* for IE7 */  
*+html #middle[id] {position: absolute;} /* for IE7 */  
 
 </style> 
    </head>  <body> 


<div id="outer">  
    <div id="middle">  
        <div id="inner" class="greenBorder">  
        </div>  
    </div>  
</div>  


 </body>  </html>

查看全文

相关阅读:
剑指offer 第十一天
 Java Arrays工具类的使用
 什么是指数加权平均、偏差修正？
深度学习——优化器算法Optimizer详解（BGD、SGD、MBGD、Momentum、NAG、Adagrad、Adadelta、RMSprop、Adam）
深度学习——卷积神经网络的经典网络（LeNet-5、AlexNet、ZFNet、VGG-16、GoogLeNet、ResNet）
深度学习论文汇总
 剑指offer 第十天
 Java String 类
 Java StringBuffer和StringBuilder类
 剑指offer 第九天

原文地址：https://www.cnblogs.com/dudu837/p/1903340.html