位置<table>粘無法在Firefox和Chrome 58

在Chrome 57中，表格標題將保持不變，但對於Chrome 58而言不變。事實證明，它不會粘在Firefox中。位置<table>粘無法在Firefox和Chrome 58

我不確定現在這兩個瀏覽器是否都是錯誤的，或者它是錯誤但現在正確的Chrome。無論哪種方式，使表頭變得粘性的正確方法是什麼？

即使爲內部表格框定義了粘性定位嗎？我非常懷疑它，考慮到*現有的定位方案都沒有定義。 – BoltClock

他們說***「這隻適用於目前最新版本的基於WebKit的瀏覽器，比如Chrome Canary或WebKit Nightly build（我在Chrome 23.0.1263.1上）。這太久了。「***。 –

就像說here，Chrome仍然會支持表格單元格粘位置。
因此，一種可能的解決方法是將CSS指向th而不是thead。
請參閱此示例：https://jsfiddle.net/owfmwdpm/

2017-05-03 18:21:00

這是否仍適用於您？所提供的例子在Firefox 49和Chromium 52中都不適用。 – Taloncor

@Taloncor，它仍然在Chrome 58上工作。 –

在FF中無效。截至2017年2月'位置：sticky;''th'在FF'58.0（64位）'中不起作用 – Green

-1

因此，要回答你的問題：

是什麼使表頭粘的正確方法？

最好的方法是使用jQuery/JavaScript和CSS的組合。

jQuery根據用戶滾動時在頁面上和視口中的位置，從要粘貼的元素中添加/刪除類。 css更新它的位置屬性，當它不粘時應用位置值relative，當它粘滯時應用fixed。

您引用的文章有一個例子鏈接： https://github.com/kingkool68/stickyHeader

2017-04-20 05:33:24 partypete25

@綠色問題去年被問到，那傢伙在舊瀏覽器版本和跨瀏覽器支持方面遇到問題。 https://caniuse.com/#search=sticky – partypete25

回答