如何垂直对齐表格?
这样
546号
彩票1
在链接元素列下对齐
547号
抽奖2
属于“链接元素1”列下
548号
彩票3
属于链接元素2
列https://onecompiler.com/html/3zyvupx94
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</=
head>
<body>
<br>
<html>
<body>
<br><br><br>
<table width="300" table-layout:fixed border="1">
<tr>
<td>
<table width="300" table-layout=fixed border="0" rules="none">
<tr> Linked Element</tr>
<tr>
<td><img src="img_girl.jpg" height="180" width="180" border="0"></td>
</tr>
<tr>
<td> 546 Lottery 1</td>
<tr>
</table>
</td>
<br>
<br>
<td>
<table width="300" table-layout=fixed border="0" rules="none">
<tr> Linked Element1</tr>
<tr>
<td><img src="img_girl.jpg" height="180" width="180" border="0"></td>
</tr>
<tr>
<td> 547 Lottery 1</td>
<tr>
</table>
</td>
<br>
<br>
<td>
<table width="300" table-layout=fixed border="0" rules="none">
<tr> Linked Element2</tr>
<tr>
<td><img src="img_girl.jpg" height="180" width="180" border="0"></td>
</tr>
<tr>
<td> 548 Lottery 1</td>
<tr>
</table>
</td>
<br>
<br>
<table width="300" border="1" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td> Number 546</td>
</tr>
<tr>
<td> Lottery 1</td>
</tr>
</tbody>
</table>
<table width="300" border="1" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td> Number 547</td>
</tr>
<tr>
<td> Lottery 1</td>
</tr>
</tbody>
</table>
<table width="300" border="1" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td> Number 548</td>
</tr>
<tr>
<td> Lottery 1</td>
</tr>
</tbody>
</table>
</tr>
</table>
</body>
</html>
要垂直对齐表格,您需要以每个“链接元素”及其相应的“数字”和“彩票”位于同一表格单元格中的方式构建 HTML (
<td>
)。
<html>
<body>
<table width="900" border="1" cellspacing="0" cellpadding="0">
<tr>
<td>
<table width="300" border="0" rules="none">
<tr><td>Linked Element</td></tr>
<tr><td><img src="img_girl.jpg" height="180" width="180" border="0"></td></tr>
<tr><td>Number 546</td></tr>
<tr><td>Lottery 1</td></tr>
</table>
</td>
<td>
<table width="300" border="0" rules="none">
<tr><td>Linked Element1</td></tr>
<tr><td><img src="img_girl.jpg" height="180" width="180" border="0"></td></tr>
<tr><td>Number 547</td></tr>
<tr><td>Lottery 2</td></tr>
</table>
</td>
<td>
<table width="300" border="0" rules="none">
<tr><td>Linked Element2</td></tr>
<tr><td><img src="img_girl.jpg" height="180" width="180" border="0"></td></tr>
<tr><td>Number 548</td></tr>
<tr><td>Lottery 3</td></tr>
</table>
</td>
</tr>
</table>
</body>
</html>
在此代码中,每个“链接元素”、“数字”和“彩票”位于同一表格单元格 (
<tr>
) 内的单独行 (<td>
) 中。外表具有三个单元格,每个单元格对应“链接元素”。这将根据您的需要垂直对齐表格。