如何实现与 HTML5 表格中的 cellpadding、cellspacing、valign、align 相同的视觉效果？

如何替换 HTML5 表格中的 cellpadding、cellspacing、valign 和align

在 HTML5 中，属性 cellpadding、cellspacing、valign 和align 已被弃用并且不再有效。但是，您仍然可以使用 CSS 实现相同的视觉效果。

替换 cellpadding

使用 padding 属性在表格单元格内添加空间：

<code class="css">th, td {
  padding: 5px;  /* Equivalent to cellpadding="5" */
}</code>

替换单元格间距

使用 border-collapse 属性来控制表格单元格之间的间距：

<code class="css">table {
  border-collapse: separate;
  border-spacing: 5px;  /* Equivalent to cellspacing="5" */
}</code>

或者，您可以使用 border-spacing: 0消除单元格之间的间距：

<code class="css">table {
  border-collapse: collapse;
  border-spacing: 0;  /* Equivalent to cellspacing="0" */
}</code>

替换 valign

使用 Vertical-align 属性垂直对齐表格单元格的内容：

<code class="css">th, td {
  vertical-align: top;  /* Equivalent to valign="top" */
}</code>

替换对齐（居中）

使用 margin 属性使表格在页面上居中：

<code class="css">table {
  margin: 0 auto;  /* Equivalent to align="center" */
}</code>

以上是如何实现与 HTML5 表格中的 cellpadding、cellspacing、valign、align 相同的视觉效果？的详细内容。更多信息请关注PHP中文网其他相关文章！