Html HTML如何在一行中对齐两个表?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14278167/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML how to align two tables in one row?
提问by user1942505
How to align two tables in one row, in the middle of the page? The results that I want to see:
如何在页面中间的一行中对齐两个表格?我想看到的结果:
11 12 11 12
21 22 21 22
The result that I get:
我得到的结果:
11 12
21 22
11 12
21 22
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
</tr>
</table>
回答by user1954395
Please use this, adjust the width as per the requirement and if you want to place at the center of the document the take a div and align it center of the page and place the following html in it.
请使用它,根据要求调整宽度,如果您想放置在文档的中心,请取一个 div 并将其对齐页面的中心并将以下 html 放入其中。
<table border="0" cellpadding="0" cellspacing="0" style="width:50%;float:left">
<tbody>
<tr>
<td> 11</td>
<td> 12</td>
</tr>
<tr>
<td> 21</td>
<td> 22</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" style="width:50%;float:left">
<tbody>
<tr>
<td> 11</td>
<td> 12</td>
</tr>
<tr>
<td> 21</td>
<td> 22</td>
</tr>
</tbody>
</table>
回答by Karamafrooz
You can create another table and embed these two tables in that :
您可以创建另一个表并将这两个表嵌入其中:
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
</tr>
</table>
</td>
<td>
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
</tr>
</table>
</td>
</tr>
</table>
or you can use the float property in css .
或者您可以在 css 中使用 float 属性。
回答by Mihai Matei
This http://jsfiddle.net/pNH3T/is one possible solution:
这个http://jsfiddle.net/pNH3T/是一种可能的解决方案:
<div style="display:block; width:100%">
<div style="margin:0 auto; width:200px;">
<table border="0" cellspacing="0" cellpadding="0" style="float:left; margin-right:10px;">
<tr>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="float:left">
<tr>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
</tr>
</table>
</div>
</div>