Question

以下是我桌子的代码。我想将最后一个单元格（注销）对齐到表格的中心。它与左边对齐，我希望它与中心对齐。

<table width="50%" border="0">
  <tr>
    <td><div align="center"><a href="viewjobseeker.php"><img src="\Proj main\images\Edu.png" alt="" width="64" height="64" /></div></td></a>
    <td><div align="center"><a href="viewemployer.php"><img src="\Proj main\images\Profile.png" alt="" width="64" height="64" /></div></td></a>
    <td><div align="center"><a href="viewjob.php"><img src="\Proj main\images\jobopening.jpg" alt="" width="64" height="64" /></div></td></a>
  </tr>
  <tr>
    <td bgcolor="#A0B9F3"><div align="center"><a href="viewjobseeker.php"><strong>View JobSeeker Profile</strong></a></div></td>
    <td bgcolor="#A0B9F3"><div align="center"><a href="viewemployer.php"><strong>View Employer Porfile</strong></a></div></td>
    <td bgcolor="#A0B9F3"><div align="center"><a href="viewjob.php"><strong>View Job Opening</strong></a></div></td>
  </tr>
  <tr>
    <td><div align="center"><a href="editjobseekeradmin.php"><img src="\Proj main\images\edit.png" alt="" width="64" height="64" /></div></td></a>
    <td><div align="center"><a href="editemployeradmin.php"><img src="\Proj main\images\editemployer.png" alt="" width="64" height="64" /></div></td></a>
    <td><div align="center"><a href="checkfeedbackadmin.php"><img src="\Proj main\images\Feedback.png" alt="" width="64" height="64" /></div></td></a>
  </tr>
  <tr>
    <td bgcolor="#A0B9F3"><div align="center"><a href="editjobseekeradmin.php"><strong>Edit JobSeeker Profile</strong></a></td>
    <td bgcolor="#A0B9F3"><div align="center"><a href="editemployeradmin.php"><strong>Edit Employer Profile</strong></a></div></td>
    <td bgcolor="#A0B9F3"><div align="center"><a href="checkfeedbackadmin.php"><strong>Check feedback</strong></a></div></td>

  </tr><div id="center1">
  <tr align="center">
   <center>
  <td align="center"><div align="center"><a href="logoutadmin.php"><img src="\Proj main\images\Log.png" alt="" width="64" height="64" /></div></td></tr></a>
  <tr align="center">    
   <td bgcolor="#A0B9F3" align="center"><div align="center"><a href="logoutadmin.php"><strong>Logout</strong></a></div></td>
     </tr></div></center>
</table>

这是表截图：

Answer 1

使用以下代码： HTML：

<table>
    <tr>
        <td><div><a href="viewjobseeker.php"><img src="\Proj main\images\Edu.png" alt="" width="64" height="64" /></a></div></td>
        <td><div><a href="viewemployer.php"><img src="\Proj main\images\Profile.png" alt="" width="64" height="64" /></a></div></td>
        <td><div><a href="viewjob.php"><img src="\Proj main\images\jobopening.jpg" alt="" width="64" height="64" /></a></div></td>
    </tr>
    <tr>
        <td><div><a href="viewjobseeker.php"><strong>View JobSeeker Profile</strong></a></div></td>
        <td><div><a href="viewemployer.php"><strong>View Employer Porfile</strong></a></div></td>
        <td><div><a href="viewjob.php"><strong>View Job Opening</strong></a></div></td>
    </tr>
    <tr>
        <td><div><a href="editjobseekeradmin.php"><img src="\Proj main\images\edit.png" alt="" width="64" height="64" /></a></div></td>
        <td><div><a href="editemployeradmin.php"><img src="\Proj main\images\editemployer.png" alt="" width="64" height="64" /></a></div></td>
        <td><div><a href="checkfeedbackadmin.php"><img src="\Proj main\images\Feedback.png" alt="" width="64" height="64" /></a></div></td>
    </tr>
    <tr>
        <td><div><a href="editjobseekeradmin.php"><strong>Edit JobSeeker Profile</strong></a></td>
        <td><div><a href="editemployeradmin.php"><strong>Edit Employer Profile</strong></a></div></td>
        <td><div><a href="checkfeedbackadmin.php"><strong>Check feedback</strong></a></div></td>
    </tr>
    <tr>
    <td colspan="3"><div><a href="logoutadmin.php"><img src="\Proj main\images\Log.png" alt="" width="64" height="64" ></a></div></td>
    </tr>
    <tr>
    <td colspan="3"><div><a href="logoutadmin.php"><strong>Logout</strong></a></div></td>
    </tr>
</table>

CSS：

table {
width:50%;
}
table, table td {
  border: 1px solid #111;
  border-collapse: collapse;
}
table div{
text-align:center;
}
table td{
background:#A0B9F3;
}

Answer 2

看看这个link，这是你的意思吗？

我所做的是清除所有不需要的div，并在最后两行的完整td的每一侧添加一个空的td。

    <tr align="center">
    <td></td>
    <td text-align="center">
        <div align="center">
            <a href="logoutadmin.php"><img src="\Proj main\images\Log.png" alt="" width="64" height="64" /> </a></div>
    </td>
    <td></td>
</tr>

<tr align="center">
    <td></td>
    <td bgcolor="#A0B9F3" align="center">
        <div align="center"><a href="logoutadmin.php"><strong>Logout</strong></a></div>
    </td>
    <td></td>
</tr>

将表格单元格对齐到中心

2 个答案: