如何通过 CSS 在父表中居中对齐 HTML 子表

发布于 2024-11-07 14:50:19 字数 468 浏览 4 评论 0原文

我有以下 HTML 表格格式:

<table style="width: 100%;">
 <tr>
  <td>
   //How to center this table within the parent-table cell?
   <table style="width: 760px;">
    <tr>
     <td>
     </td>
    </tr>
   </table>
  </td>
 </tr>
</table>

由于 HTML5 不支持表格的“align=center”,我试图找出如何在上面示例中的子表格的 CSS 中模拟“align=center”。

我尝试过使用 CSS margin 属性,但没有成功。

如何使上例中的子表居中?

I have the following HTML table format:

<table style="width: 100%;">
 <tr>
  <td>
   //How to center this table within the parent-table cell?
   <table style="width: 760px;">
    <tr>
     <td>
     </td>
    </tr>
   </table>
  </td>
 </tr>
</table>

Since HTML5 doesn't support the 'align=center' for tables, I am trying to figure out how to simulate the 'align=center' in CSS for the sub-table in my example above.

I've tried messin' around with the CSS margin attribute to no avail.

How do I center the sub-table in the example above?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

饮惑 2024-11-14 14:50:19
table {border:solid 1px #0f0}
table table {border:solid 1px #f00;margin: 0 auto}
<table style="width: 100%;">
 <tr>
  <td>
   //How to center this table within the parent-table cell?
   <table style="width: 760px;">
    <tr>
     <td>
         Center This Table Dawg
     </td>
    </tr>
   </table>
  </td>
 </tr>
</table>

margin:0 auto; 在本例中有效,在 IE 7-9、FF 4、Chrome 11 中测试/有效

table {border:solid 1px #0f0}
table table {border:solid 1px #f00;margin: 0 auto}
<table style="width: 100%;">
 <tr>
  <td>
   //How to center this table within the parent-table cell?
   <table style="width: 760px;">
    <tr>
     <td>
         Center This Table Dawg
     </td>
    </tr>
   </table>
  </td>
 </tr>
</table>

margin:0 auto; worked in this example, tested/worked in IE 7-9, FF 4, Chrome 11

总以为 2024-11-14 14:50:19
<table style="width: 100%;">
 <tr>
  <td>
    <table style="width: 760px; margin: auto;">
     <tr>
      <td>
      ss
      </td>
     </tr>
    </table>
   </td>
  </tr>
 </table>
<table style="width: 100%;">
 <tr>
  <td>
    <table style="width: 760px; margin: auto;">
     <tr>
      <td>
      ss
      </td>
     </tr>
    </table>
   </td>
  </tr>
 </table>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文