展開/收縮表格是網站中比較常見的需求，它可以使得頁面更加緊湊，用戶也可以更加方便地查看所需信息。下面我們將通過CSS來實現這個功能。 首先，我們需要一個基礎的表格，如下所示：

<table class="table">
<thead>
<tr>
<th>編號</th>
<th>姓名</th>
<th>年齡</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>張三</td>
<td>28</td>
</tr>
<tr>
<td>2</td>
<td>李四</td>
<td>35</td>
</tr>
</tbody>
</table>

接著，我們需要用CSS來實現展開/收縮的效果。這里我們使用偽類`:target`來實現。

<style>
.table {
border-collapse: collapse;
margin-bottom: 20px;
}
.table th,
.table td {
border: 1px solid #cccccc;
padding: 10px;
text-align: center;
}
.table tbody tr:nth-child(even) {
background-color: #f7f7f7;
}
/* 當前行的樣式 */
.table tr:target {
background-color: #ffff99;
}
/* 隱藏行的樣式 */
.table tr:not(:target) + tr {
display: none;
}
</style>

以上代碼中，我們先為表格定義了一些基礎樣式，如邊框、間距等。其中，`:nth-child(even)`用于設置表格隔行變色的樣式。 接下來，我們為當前行設置了`:target`樣式，使得當用戶點擊某一行時，該行的背景色會變成黃色。 同時，我們為隱藏行應用了`:not(:target)`樣式，當用戶點擊某一行時，該行后面的下一行就會顯示出來。 最后，我們只需要在每一行的tr標簽上添加錨點即可實現展開/收縮的效果。 現在，我們已經完成了基于CSS的展開/收縮表格功能，用戶可以方便地查看所需信息了。