以下是我的程式碼
table {
border: 1px solid;
width: 20.5%;
}
<table >
<tr>
<th align = "left">Ann-Maree Smith </th>
<th align = "left">Mitz Perez</th>
</tr>
<tr>
<td>Bld 40:133, Wollongong</br>Campus </td>
<td>Bld 4:105, Wollongong</br>Campus</td>
</tr>
<tr>
<td>(02) 4221 4714 </td>
<td>(02) 4221 3833 </td>
</tr>
<tr>
<td>Mon-Fri</td>
<td>Mon-Fri</td>
</tr>
<tr>
<td>ams@uow.edu.au</td>
<td>mperez@uow.edu.au</td>
</tr>
</table>
我正在嘗試實現這個效果 [1]: https://i.stack.imgur.com/qnBdQ.png 然而，我的表格只有一個邊框，缺少“列邊框”，而不是圖片中看到的雙邊框。我想知道如何實現我想要的效果的最佳方法。
你需要改變表格的結構，因為你基本上想要在表格單元格周圍有一個實線邊框，然後在整個表格周圍有一個實線邊框，否則你會在角落處得到方框。
<head> <style> table { border: 1px solid; width: 20.5% } tr > td { border: 1px solid; } tr > td > span.name { font-weight: bold; } tr > td > span { display: block; } </style> </head> <body> <table > <tr> <td> <span class="name">Ann-Maree Smith</span> <span>Bld 40:133, Wollongong</br>Campus</span> <span>(02) 4221 4714 </span> <span>Mon-Fri</span> <span>ams@uow.edu.au</span> </td> <td> <span class="name">Mitz Perez</span> <span>Bld 4:105, Wollongong</br>Campus</span> <span>(02) 4221 3833 </span> <span>Mon-Fri</span> <span>mperez@uow.edu.au</span> </td> </tr> </table> </body>