居中对齐HTML表格

Question

在我正在处理的页面上，我似乎无法将第一行中的图像和下面的两列文本居中（两列不应该更多）比图像的宽度） 这是页面：http://www.puzzles-et-jeux.com/fr/page/minipuzzles.html 我花了很多时间试图解决这个问题。 我想把它保存在HTML中因为我必须赶时间，因为我必须为每个图像创建20页不同宽度/ +布局的排序。

Answer 1

对于您的设计，通常的做法是使用div而不是表格。这样，您的布局将通过适当的样式更易于维护和更改。它确实需要一些人习惯，但从长远来看它会帮助你很多，你会学到很多关于造型的工作原理。但是，我会为您解决手头的问题。

在样式表中，边距和填充设置为0像素。这会覆盖您的align="center"属性。我建议您从CSS中取出这些设置，因为您通常不希望以这种方式影响所有元素。如果您已经知道CSS中发生了什么，并且希望保持这种状态，那么您必须将一种样式应用于表以覆盖先前的集合。您可以将表格设为class，也可以将样式与HTML内联。以下是两个选项：

1. 上课：

   <table class="centerTable"></table>

在你的style.css文件中你会有这样的东西：

.centerTable { margin: 0px auto; }

1. 内嵌HTML：

   <table style="margin: 0px auto;"></table>

如果您决定清除边距和填充设置为0px，那么您可以在align="center"标记上保留<td>，以便对齐您希望对齐的列。

Answer 2

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

这肯定会奏效。 干杯

Answer 3

试试这个 -

<table align="center" style="margin: 0px auto;"></table>

Answer 4

<table align="center"></table>

这适合我。