居中表和使页面响应

Question

我想使页面充满固定表（其中6个）。我用简单的CSS做了它们，但是我想把它们放在所有设备的中心，并使页面对所有设备负责。我知道这只是CSS，但我很困惑。

P.S我来自我的电话，我无法分享我的代码。

在此先感谢。

Answer 1

html, body, .container-table { 
 
    height: 100%; 
 
} 
 
.container-table { 
 
    display: table; 
 
} 
 
.vertical-center-row { 
 
    display: table-cell; 
 
    vertical-align: middle; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 

 
<div class="container container-table"> 
 
    <div class="row vertical-center-row"> 
 
     <div class="text-center col-md-4 col-md-offset-4" style="background:red"> 
 
     <table> 
 
<tr> 
 
<th>COL1</th> 
 
<th>COL2</th> 
 
</tr> 
 
<tr> 
 
<td>TD COL1</td> 
 
<td>TD COL1</td> 
 
</tr> 
 
<table> 
 
     </div> 
 
    </div> 
 
</div>

根据您的要求需要使用CSS响应像引导，也可以使用@media屏幕特定设备

@media screen and (min-width: 480px) { 
    table{ 
     //your property; 
    } 
}