Question

我有一张桌子，我希望以我的网页为中心。 html文件从php文件加载一个表，但由于某种原因，即使将center-block作为一个类（使用bootstrap），也没有任何反应。表格加载正常，它没有居中。

HTML：

<script>
  $(document).ready(function(){                          
    $(".mytable").load('pastmoods.php');                         
  });
</script>
<div class = "mytable center-block" style="text-align:center"></div>

PHP：

$query = mysqli_query($db_connection, "SELECT * FROM DemoUser");
$fields_num = mysqli_num_fields($query);

echo "<h1>Past Moods: {$table}</h1>";
echo "<table border='1'><tr>";
// printing table headers
for($i=0; $i<$fields_num; $i++)
{
  $field = mysqli_fetch_field($query);
  echo "<td>{$field->name}</td>";
}
echo "</tr>\n";
// printing table rows
while($row = mysqli_fetch_row($query))
{
  echo "<tr>";

  // $row is array... foreach( .. ) puts every element
  // of $row to $cell variable
  foreach($row as $cell)
    echo "<td>$cell</td>";    
  echo "</tr>\n";
}
mysqli_free_result($query);

Answer 1

您可以为div使用固定宽度并使用文本中心引导类，而不是内联样式。

Answer 2

 echo "<table border='1' align='center' width='xxx'><tr>";

试试这个。

按照@Aashray的提议编辑

Answer 3

根本不要使用中心。坚持css。将表放在'div'或'span'中，并用css将其置于中心位置，确保你已设置了Sachi所述的边距。

Answer 4

你的桌子左右浮动了吗？这可能是个问题。确保它上面有float：none，或者根本没有浮动。

此外，请确保表的父元素具有表格居中的空间。例如，如果表格及其宽度内的父元素大小相同，则表格中没有空间。

确保表格不是宽度：100％，因为它适合其父级而不居中。

Answer 5

我假设你需要CSS：

.mytable.center-block {
    margin: 0 auto;
}

这取决于<div class="mytable center-block style="text-align"></div>所在的容器。

例如，这会根据父div：

使您的表居中

HTML

<div class="parent-div">
    <div class="mytable center-block"></div>
</div>

CSS

.parent-div {
    width: 1000px; /* Let's say for this example the parent-div is 1000px wide */
    height: 400px; /* Some height, just to give it dimension */
}

.mytable.center-block {
    margin: 0 auto; /* Centers the table within the parent-div */
}

当然，这是考虑到该表小于1000px宽，我假设为此示例。如果这有帮助，请告诉我。

修改：另请注意，将HTML元素放在<script>标记下方并不是一个好习惯。理想情况下，<script>代码应位于标题内或结束正文标记</body>之前。

从外部php文件创建的中心项

5 个答案: