32

我正在重构一个旧网站，那个迷宫里到处都是桌子。我们正在迁移到 HTML5，我需要修复一个完整的表格

<td align="center">

代码。我通过创建一个类找到了部分解决方案

.centered {
    text-align: center;
}

并将其分配给每个包含文本的 TD。
但这不适用于图像和其他一些元素。

margin: auto;

也不会工作。
将所有内容集中在 TD 中的最快方法是什么？

4

5 回答 5

37

如果它们是块级元素，则不会受到text-align: center;. 有人可能已经设置img { display: block; }了，这会使它失控。你可以试试：

td { text-align: center; }
td * { display: inline; }

如果它看起来像你想要的，你绝对应该用想要的元素替换 * ，比如：

td img, td foo { display: inline; }
于 2013-06-07T13:59:13.313 回答
11

您可以使用内联 css ：
<td style = "text-align: center;">

于 2014-05-02T11:16:10.597 回答
5

根据 HTML5 CR，它也需要对“过时”功能的持续支持，该align=center属性相当棘手。表格的渲染规则说：td具有该属性的元素“应在其自身中居中文本，就好像它们在表示提示中将其'text-align'属性设置为'center'，并将后代与中心对齐。”< /p>

对齐后代的定义是，浏览器将“仅将那些同时具有 'margin-left' 和 'margin-right' 属性计算为 'auto' 以外的值的后代对齐，这些后代过度约束并且具有这两个边距之一的已使用值被强制设置为更大的值，并且它们本身不具有适用的对齐属性。当多个元素要对齐特定的后代时，嵌套最深的此类元素预计会覆盖其他元素。对齐的元素应该通过相应地设置其左右边距的使用值来对齐。”</p>

所以这真的取决于内容。

于 2013-06-07T14:05:34.047 回答
0

您可以使用此代码作为表对齐的替代品

table 
{
    margin:auto;
}
于 2016-02-25T11:43:26.747 回答
-3

将此代码添加到您的样式表中：

margin-top:80px;
于 2018-11-28T01:45:42.990 回答