Question

我正在尝试为一个类创建一个网页，因此无法将我的表放在html中。这就是我输入的html：

<table align="center" width="50%">
<tr>
<td><b>Resume:</b></td>
<td><a href="UMD Resume, general revised.docx">Click here to download my resume.</a></td>
</tr>
<tr>
<td><b>LinkedIn:</b></td>
<td><a href="https://www.linkedin.com/in/michellefeyder">Click here to open my LinkedIn profile.</a></td>
</tr>
</table>

然而，每当我尝试添加＆＃39;对齐＆＃39;和＃＆＃39;宽度＆＃39;在属性中，它只影响我的宽度。它不会使桌子居中。有没有人知道在应用宽度时将页面居中的方法？

谢谢。如果需要，我可以提供我的html页面的标记。

Answer 1

试试这个：

<table style="margin:0px auto; width:500px">

然而，对齐已经过时，所以你可以试试这个：

table {
  width:500px;
  margin: 10px auto;
}

即为表提供宽度并设置自动水平边距

Answer 2

只需将其添加到您的表格

即可

table {
        text-align: center;
    }

<强> Live Demo

Answer 3

尝试将其放入

 <p align="center">

<table align="center" width="50%">
<tr>
<td><b>Resume:</b></td>
<td><a href="UMD Resume, general revised.docx">Click here to download my resume.</a></td>
</tr>
<tr>
<td><b>LinkedIn:</b></td>
<td><a href="https://www.linkedin.com/in/michellefeyder">Click here to open my LinkedIn profile.</a></td>
</tr>
</table>

</p>

Answer 4

将您的表格封装在包装div中：

<div class="wrapper">

  <table>
    <tr>
      <td><b>Resume:</b></td>
      <td><a href="UMD Resume, general revised.docx">Click here to download my resume.</a></td>
    </tr>
    <tr>
      <td><b>LinkedIn:</b></td>
      <td><a href="https://www.linkedin.com/in/michellefeyder">Click here to open my LinkedIn profile.</a></td>
    </tr>
  </table>

 </div>

然后在你的css文件中（如果你想把文本居中）：

table {
  text-align: center;
  width: 50%
}

.wrapper {
  margin: 0 auto;
}

Answer 5

如果不定义元素的外部容器宽度，则无法居中。让我告诉你一个更好的设置方法。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        #outside-container {
            width: 100%;
        }
        #form-container {
            width: 50%;
            margin: 0px auto;
        }
    </style>
</head>
<body>
<div id="outside-container">
    <div id="form-container">
        <table align="center">
            <tr>
                <td><b>Resume:</b></td>
                <td><a href="UMD Resume, general revised.docx">Click here to           download my resume.</a></td>
            </tr>
            <tr>
                <td><b>LinkedIn:</b></td>
                <td><a href="https://www.linkedin.com/in/michellefeyder">Click here to open my LinkedIn profile.</a></td>
            </tr>
        </table>
    </div> <!-- CLOSE #form-container -->
</div>  <!-- CLOSE #outside-container -->
</body>
</html>

HTML表格居中

5 个答案: