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;}

我如何将桌子居中？

2 个答案: