黏性標題可以在滾動 Div 中用於表標題嗎？

滾動 Div 中的黏性標題

位置：黏性；屬性在 Webkit 中獲得了關注，使元素在滾動期間能夠在其父容器中保持固定。然而，一些開發人員表示需要將此功能擴展到包含表格的滾動 div 元素。

黏性定位可以套用於捲動 div 內的表格標題嗎？

答案：

確實，位置：置頂；現在可以用於 ; elements 截至 2018 年！

實作：

只需將以下行加入您的CSS 樣式表：

<code class="css">thead th { position: sticky; top: 0; }</code>

先決條件：

• 確保您的表格包含 。

  範例表格標記：

  <code class="html"><table>
      <thead>
          <tr>
              <th>column 1</th>
              <th>column 2</th>
              <th>column 3</th>
              <th>column 4</th>            
          </tr>    
      </thead>
      <tbody>
        // body code
      </tbody>
  </table></code>

  其他選項：

  • 其他選項：

  <code class="css">thead tr:first-child th { position: sticky; top: 0; }</code>

  要要修正 的第一行滾動時，使用以下內容：

  瀏覽器支援：截至2018 年3 月，現代瀏覽器廣泛支持thead 元素的黏性定位，感謝開發者社群的努力。

以上是黏性標題可以在滾動 Div 中用於表標題嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！