“Tabel tetap tajuk” Kode Jawaban

Tabel tetap tajuk

.tableFixHead thead th { position: sticky; top: 0; }
itaca9

html meja scrollable body fixed header

/*Simply*/  position:sticky; top: 0; /*your th elements*/
Ugliest Unicorn

Tabel tetap tajuk

<div class="tableFixHead">
  <table>
    <thead>
      <tr><th>TH 1</th><th>TH 2</th></tr>
    </thead>
    <tbody>
      <tr><td>A1</td><td>A2</td></tr>
      <tr><td>B1</td><td>B2</td></tr>
      <tr><td>C1</td><td>C2</td></tr>
      <tr><td>D1</td><td>D2</td></tr>
      <tr><td>E1</td><td>E2</td></tr>
    </tbody>
  </table>
</div>
Angry Alpaca

Tabel tetap tajuk

.tableFixHead          { overflow: auto; height: 100px; }
.tableFixHead thead th { position: sticky; top: 0; z-index: 1; }

/* Just common table stuff. Really. */
table  { border-collapse: collapse; width: 100%; }
th, td { padding: 8px 16px; }
th     { background:#eee; }
Angry Alpaca

Tabel tetap tajuk

table tbody { display:block; max-height:450px; overflow-y:scroll; }
table thead, table tbody tr { display:table; width:100%; table-layout:fixed; }
Angry Alpaca

Jawaban yang mirip dengan “Tabel tetap tajuk”

Pertanyaan yang mirip dengan “Tabel tetap tajuk”

Lebih banyak jawaban terkait untuk “Tabel tetap tajuk” di CSS

Jelajahi jawaban kode populer menurut bahasa

Jelajahi bahasa kode lainnya