如何将两个并排的表格居中排列。就是两个表格排在一起，让后两个表格刚在网页的中间
这位网友你好，你可以将两个表格分别设置为左浮动，然后用一个大的div将两个表格包起来，设置大div左右margin为auto即可。
如果不会请贴代码。
如果不会请贴代码。
温馨提示：答案为网友推荐，仅供参考
第1个回答 2015-03-16
刚写的，能达到你的要求。代码如下：
<!doctype html><html>
<head>
<meta charset="utf-8">
<title>表格居中</title>
</head>
<body>
<table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="50%">
<table width="100%%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td colspan="3" align="center">第一个表格</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table></td>
<td width="50%">
<table width="100%%" border="1" cellspacing="1" cellpadding="1">
<tr>
<td colspan="3" align="center">第二个表格</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
第2个回答 2015-10-12
在表格标签前面加上<center>，表格标签后面加上</center>就可以了。
第3个回答 2015-03-16
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
RunJS 演示代码
</title>
<style>
.content{
border:1px solid black;
width:500px;
margin:auto;
}
table {
border:1px solid black;
border-collapse:collapse;
position: relative;
height: 100px;
}
td {
border:1px solid black;
}
.t1 {
width: 200px;
}
.t2 {
width: 300px;
margin: -100px 0px 0px 200px;
}
</style>
</head>
<body>
<div class='content'>
<table class="t1">
<tr>
<td>
11
</td>
</tr>
</table>
<table class="t2">
<tr>
<td>
22
</td>
</tr>
</table>
</div>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
RunJS 演示代码
</title>
<style>
.content{
border:1px solid black;
width:500px;
margin:auto;
}
table {
border:1px solid black;
border-collapse:collapse;
position: relative;
height: 100px;
}
td {
border:1px solid black;
}
.t1 {
width: 200px;
}
.t2 {
width: 300px;
margin: -100px 0px 0px 200px;
}
</style>
</head>
<body>
<div class='content'>
<table class="t1">
<tr>
<td>
11
</td>
</tr>
</table>
<table class="t2">
<tr>
<td>
22
</td>
</tr>
</table>
</div>
</body>
</html>
第4个回答 推荐于2016-05-28
<style type="text/css">
#biaoge{
margin:6px;
padding:2px;
text-align:center;
}
#biaoge table{
margin:0px auto;
}
</style>
<div id="biaoge">
<table>
<tr><td>单元格1</td><td>单元格2</td></tr>
<tr><td>单元格3</td><td>单元格4</td></tr>
<tr><td>单元格5</td><td>单元格6</td></tr>
<tr><td>单元格7</td><td>单元格8</td></tr>
</table>
</div>
#biaoge{
margin:6px;
padding:2px;
text-align:center;
}
#biaoge table{
margin:0px auto;
}
</style>
<div id="biaoge">
<table>
<tr><td>单元格1</td><td>单元格2</td></tr>
<tr><td>单元格3</td><td>单元格4</td></tr>
<tr><td>单元格5</td><td>单元格6</td></tr>
<tr><td>单元格7</td><td>单元格8</td></tr>
</table>
</div>
