怎么用css 让整个table位置页面水平居中，

Question

在百度上找了半天 发现没一个能用的

Answer 1

需要准备的材料分别有：电脑、chrome浏览器、html编辑器。

1、首先，打开html编辑器，新建一个html文件，例如：index.html。

2、其次，在index.html中的<style>标签中，输入css代码：table {margin: auto;} body{text-align: center;}。

3、最后，浏览器运行index.html页面，此时会发现通过用css让整个table在页面中水平居中成功。

Answer 2

css中让table水平居中的步骤如下：

步骤一：

假如创建一个三行四列的表格，设置表格边框为1，宽度为200px，高度为100px；

步骤二：

在html的head文件添加css样式，（因为css中没有明确的属性让table居中，所以相对定位的值需要自己调试。）如下；

步骤三：

运行程序，让整个table居中的问题就解决了

或者是在html中添加table的属性align="center";都可以实现table居中。

扩展资料：

CSS Table 属性

1.border-collapse    设置是否把表格边框合并为单一的边框。    

2.border-spacing    设置分隔单元格边框的距离。    

3.caption-side    设置表格标题的位置。    

4.empty-cells    设置是否显示表格中的空单元格。    

5.table-layout    设置显示单元、行和列的算法。    

本回答被网友采纳

Answer 3

CSS中让整个table位置页面水平居中且不影响table内部结构可使用 center标签是最简单。

<center> 标签定义用法及案例：

对浏览器的支持：所有浏览器都支持 <center> 标签。

定义和用法：对其所包括的文本进行水平居中。

HTML 与 XHTML 之间的差异：

在 HTML 4.01 中，center 元素不被赞成使用。

在 XHTML 1.0 Strict DTD 中，center 元素不被支持。

标准属性：id, class, title, style, dir, lang, xml:lang。


事件属性：onclick, ondblclick, onmousedown, onmouseup, onmouseover,
onmousemove, onmouseout, onkeypress, onkeydown, onkeyup。


案例（table位置页面水平居中）：

<center>
<table width="300" border="0">
  <tr>
    <td>表格整体居中</td>
    <td>表格整体居中</td>
  </tr>
  <tr>
    <td>表格整体居中</td>
    <td>表格整体居中</td>
  </tr>
  <tr>
    <td>表格整体居中</td>
    <td>表格整体居中</td>
  </tr>
</table>
</center>
//只对table整体水平居中。对table内部结构无任何影响。使用提示：

A、请使用 CSS 样式来居中文本。

B、代码中标点符号均为英文状态。

Answer 4

添加一个<center></center>，代码如下：
<center>
<table>
<tr>
<td>
</td>
</tr>
</table>
</center>本回答被提问者采纳

Answer 5

用IE6 Chrome Firefox试验的结果是，CSS中加入：

table {
margin-right: auto;
margin-left: auto;
}

就一定居中。

如果没有实现居中，那就是你的其他代码元素的样式影响了table.