混水摸魚 ╮(╯▽╰)╭

學無止境,教學相長

CSS, HTML

[ CSS ] – table thead 固定

<table>
	<thead style="display:block;">
		<tr>
			<th style="width:100px;">標題一</th>
			<th style="width:100px;">標題二</th>
			<th style="width:100px;">標題三</th>
			<th style="width:100px;">標題四</th>
		</tr>
	<thead>
	<tbody style="height:400px;overflow:auto;display:block">
		<tr>
			<td style="width:100px;">內容一</td>
			<td style="width:100px;">內容二</td>
			<td style="width:100px;">內容三</td>
			<td style="width:100px;">內容四</td>
		</tr>
	</tbody>
</table>

註1:th td 的寬度要設成一樣的 不然會跑版
註2:thead tbody 兩個都要加上 display:block;

標題一 標題二 標題三 標題四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
內容一 內容二 內容三 內容四
如果我的文章有幫助到您的話,請幫我點擊廣告,一天最少需有五人點擊本站才有足夠經費繼續經營下去,感謝! ⇩⇩⇩ 如果我的文章有幫助到您的話,請幫我點擊廣告,一天最少需有五人點擊本站才有足夠經費繼續經營下去,感謝! ⇧⇧⇧
  •   
  •  
  •  
  •  
  •  

2 留言

  1. Stan

    感謝前輩一點通!

發佈留言

佈景主題由 Anders Norén 所設計