55

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

4

5 回答 5

106

对于您的设计，通常使用 div 而不是表格。这样，您的布局将通过适当的样式更易于维护和更改。确实需要一些时间来适应，但从长远来看，它会帮助你很多，你会学到很多关于造型如何工作的知识。但是，我将为您提供手头问题的解决方案。

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

  1. 有一个类：

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

在您的 style.css 文件中，您将拥有如下内容：

.centerTable { margin: 0px auto; }

  1. 与您的 HTML 内联：

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

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

于 2012-12-28T17:52:44.153 回答
44 
table
{ 
margin-left: auto;
margin-right: auto;
}

这肯定会奏效。干杯

于 2015-10-30T20:00:10.493 回答
16

试试这个 -

<table align="center" style="margin: 0px auto;"></table>
于 2012-12-28T17:24:33.260 回答
1

给它一个中心类

然后在 CSS

.center {
  margin-left: auto;
  margin-right: auto;
}
于 2021-10-27T09:32:03.400 回答
-1 
<table align="center"></table>

这对我有用。

于 2016-12-03T09:45:12.343 回答