,,

【HTML】最簡單的純CSS“position:sticky;”實(shí)現(xiàn)table固定表頭標(biāo)題行

當(dāng)前位置：點(diǎn)晴教程→知識管理交流 →『技術(shù)文檔交流』

admin

2023年12月12日 17:56 本文熱度 1414

利用CSS：position:sticky;，就可以無需其他代碼實(shí)現(xiàn)table固定表頭標(biāo)題行的效果了：

<div id="myScrollingDiv" style="border:1px solid #AAAAAA;height:370px;width:100%;overflow:auto;">
<table border="1" bordercolor="#AAAAAA" cellpadding="0" cellspacing="0" style="border-collapse: collapse;" width="100%" bgcolor="#FFFFFF" align="center" id="show_detail">
  <tr align="center" height="25" bgcolor="#DEDEDE" style="position:sticky;top:0px;font-weight:bold;">
<td width="5%" nowrap><b>隱藏概念</b></td>
<td width="5%" nowrap><b>恢復(fù)隱藏</b></td>
<td width="5%" nowrap><b>序號</b></td>
<td width="40%" nowrap><b>概念和主題</b></td>
<td width="40%" nowrap><b>創(chuàng)建時(shí)間</b></td>
<td width="5%" nowrap><b>天數(shù)</b></td>
  </tr>
***********其他行次信息************
</table>
</div>

注意：必須將此表格放在一個(gè)固定高度的div中，并且此div的CSS必須設(shè)置為：overflow:auto;，否則無此效果。

效果：

該文章在 2023/12/13 12:09:55 編輯過

關(guān)鍵字查詢

相關(guān)文章

正在查詢...

點(diǎn)晴ERP是一款針對中小制造業(yè)的專業(yè)生產(chǎn)管理軟件系統(tǒng),系統(tǒng)成熟度和易用性得到了國內(nèi)大量中小企業(yè)的青睞。

點(diǎn)晴PMS碼頭管理系統(tǒng)主要針對港口碼頭集裝箱與散貨日常運(yùn)作、調(diào)度、堆場、車隊(duì)、財(cái)務(wù)費(fèi)用、相關(guān)報(bào)表等業(yè)務(wù)管理，結(jié)合碼頭的業(yè)務(wù)特點(diǎn)，圍繞調(diào)度、堆場作業(yè)而開發(fā)的。集技術(shù)的先進(jìn)性、管理的有效性于一體，是物流碼頭及其他港口類企業(yè)的高效ERP管理信息系統(tǒng)。

點(diǎn)晴WMS倉儲管理系統(tǒng)提供了貨物產(chǎn)品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質(zhì)期管理,貨位管理,庫位管理,生產(chǎn)管理,WMS管理系統(tǒng),標(biāo)簽打印,條形碼,二維碼管理,批號管理軟件。

點(diǎn)晴免費(fèi)OA是一款軟件和通用服務(wù)都免費(fèi)，不限功能、不限時(shí)間、不限用戶的免費(fèi)OA協(xié)同辦公管理系統(tǒng)。

公交车上荫蒂添的好舒服的电影-公用玩物(np双xing总受)-公用小荡货芊芊-公与妇仑乱hd-攻把受做哭边走边肉楼梯play-古装一级淫片a免费播放口

【HTML】最簡單的純CSS“position:sticky;”實(shí)現(xiàn)table固定表頭標(biāo)題行