html 表格字符居中显示_如何在HTML中居中显示表格？

最新推荐文章于 2024-10-14 11:41:51 发布

cunjiu9486

最新推荐文章于 2024-10-14 11:41:51 发布

阅读量4.8k

点赞数 2

文章标签： css html js 数据可视化 javascript ViewUI

原文链接：https://www.poftut.com/how-to-center-table-in-html/

版权

html 表格字符居中显示

HTML table provides the ability to show text, data, and other elements. While using tables we may want to center the table or table contents to the center. Centering the table and its contents will be centered and look pretty.

HTML表提供了显示文本，数据和其他元素的功能。使用表格时，我们可能希望将表格或表格内容居中放置在中心。居中放置表格及其内容将居中并看起来很漂亮。

中心表，具有margin-left和margin-right属性 (Center Table with margin-left and margin-right Attribute)

The first way to make an HTML table center is by using margin-left and margin-right CSS attributes. We can set these attributes as auto or the same value in order to make the table center.

使HTML表格居中的第一种方法是使用margin-left和margin-right CSS属性。我们可以将这些属性设置为auto或相同的值，以使表格居中。

<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>

<table style="margin-left:auto; margin-right:auto;">
<tr>
<th>Name</th>
<th>Surname</th>
</tr>
<tr>
<td>İsmail</td>
<td>Baydan</td>
</tr>
<tr>
<td>Ahmet Ali</td>
<td>Baydan</td>
</tr>
<tr>
<td>Elif Ecrin</td>
<td>Baydan</td>
</tr>
</table>

</body>
</html>

Center Table with margin-left and margin-right Attribute

具有align属性的中心表内容(Center Table Content with align Attribute)

The table HTML element provides an align attribute which will align the table. The align attribute can get right, left and center values. In the following example, we will set the align attribute to the center.

表格HTML元素提供了一个align属性，它将对齐表格。 align属性可以获取right ， left和center值。在下面的示例中，我们将align属性设置为center 。

<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>

<table align="center">
<tr>
<th>Name</th>
<th>Surname</th>
</tr>
<tr>
<td>İsmail</td>
<td>Baydan</td>
</tr>
<tr>
<td>Ahmet Ali</td>
<td>Baydan</td>
</tr>
<tr>
<td>Elif Ecrin</td>
<td>Baydan</td>
</tr>
</table>

</body>
</html>