CSS橫向凍結列是指在表格中將某一列的內容凍結在頁面左側,以便用戶在瀏覽表格數據時,不必頻繁地左右滾動屏幕。
table{ width:100%; border-collapse:collapse; } th,td{ border:1px solid #ccc; padding:5px; } thead th{ position:sticky; left:0; background-color:#eee; }
上述CSS代碼通過將表頭th元素的position屬性設置為sticky,同時將其left屬性設置為0,實現了將表頭凍結在頁面左側的效果。此外,還可以通過設置background-color屬性來美化表頭樣式。
需要注意的是,該方式比較適用于表格列數不多的情況,如果表格列數較多,此方法會導致頁面左側出現過多的凍結列,影響用戶體驗。
上一篇css 模擬 文件夾特效
下一篇mysql游標輸出少一條