Question

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

P.S我来自手机，我无法分享我的代码。

提前致谢。

Answer 1

＆＃13;

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

＆＃13;

<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>

＆＃13;

根据您的要求，需要使用响应式CSS如bootstrap，或者您可以使用 @media screen 来获取特定设备

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

使表格居中并使页面响应

1 个答案: