表格对齐问题
在编写 html 表格时，有时需要让某些列向右对齐，以呈现更加整齐美观的视觉效果。
例如，以下代码是一个简单的表格：
<table>
<thead>
<tr>
<th>#</th>
<th>first</th>
<th>last</th>
<th>handle</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>mark</td>
<td>otto</td>
<td>@mdo</td>
</tr>
<tr>
<th>2</th>
<td>jacob</td>
<td>thornton</td>
<td>@fat</td>
</tr>
<tr>
<th>3</th>
<td>larry</td>
<td>the bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>在这个表格中，我们希望将最后两列（"last" 和 "handle"）向右对齐。
立即学习“前端免费学习笔记（深入）”；
为了实现这个效果，可以采用以下方式：
- 设置表格宽度为 100%：这将确保表格占据整个可用空间。
- 为 1、3、4 列设置固定宽度：这将确保这些列的宽度保持不变。
- 不为 2 列设置宽度：这将允许 2 列根据其内容自动调整宽度。
修改后的 html 代码如下：
<table>
<thead>
<tr>
<th width="50px">#</th>
<th>First</th>
<th width="300px">Last</th>
<th width="200px">Handle</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<th>2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<th>3</th>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>通过这些调整，最后两列将完美地向右对齐。
