如何使桌子居中？

Question

我想知道这张桌子怎么居中？我很难把这个放在中心。我尝试过以CSS为中心，但在CSS中放置标签时，我可能做错了什么。我试过标签"table.tftable“

<style>
     table {
        -moz-border-radius: 5px !important;
         border-collapse: collapse !important;
         border: none !important;
     }
     table th, table td { border: none !important }
     table th:first-child {
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
     }
     table th:last-child {
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border-radius: 5px;
     }
     table tr:last-child td:first-child {
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
             border-radius: 5px;
     }
     table tr:last-child td:last-child {
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border-radius: 5px;
     }
     table tr:hover td { background-color: #2f2f2f !important }
    <table id="tfhover" class="tftable" border="1">
       <style type="text/css">
     table.tftable {font-size:12px;color:#fbfbfb;width:100%;border-width: 1px;border-color: #686767;border-collapse: collapse;text-align:center;}
     table.tftable th {font-size:12px;background-color:#171515;border-width: 1px;padding: 8px;border-color: #686767;text-align:center;}
     table.tftable tr {background-color:#000000;}
     table.tftable td {font-size:12px;border-width: 1px;padding: 8px;border-color: #686767;text-align:center;}
   </style>
      <table id="tfhover" class="tftable" border="1" style="width: 680px;">
         bunch of content
      </table>

Answer 1

要在页面上居中放置表格，或者如果表格在容器中，则将其放在使用以下代码的中心：

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

如果左边距和右边距相等，则兼容浏览器应自动假定元素需要居中对齐

演示http://jsfiddle.net/uKyQu/

Answer 2

要使表格居中，应添加以下行：

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