到目前为止，这是我的代码非常简单的设计，我只是不知道如何固定第一列或使其可排序
最终目标是将其导入 Muse
https://jsfiddle.net/clykins/o4qap6j8/
<style type="text/css">
<div style="float:left; width: 150px">
Navigation Code Here
</div>
<div style="float: left">
Other Content Here
</div>
<div style="clear:both"></div>
.tftable {font-size:12px;color:#333333;width:100%;border-width: 1px;border-color: #729ea5;border-collapse: collapse;}
.tftable th {font-size:12px;background-color:#acc8cc;border-width: 1px;padding: 8px;border-style: solid;border-color: #729ea5;text-align:left;}
.tftable tr {background-color:#d4e3e5;}
.tftable td {font-size:12px;border-width: 1px;padding: 8px;border-style: solid;border-color: #729ea5;}
.tftable tr:hover {background-color:#ffffff;}
</style>
<table class="tftable" border="1">
<tr><th>Header 1</th><th>Header 2</th><th>Header 3</th><th>Header 4</th><th>Header 5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
</tr>
<tr><td>Row:1 Cell:1</td><td>Row:1 Cell:2</td><td>Row:1 Cell:3</td><td>Row:1 Cell:4</td><td>Row:1 Cell:5</td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>400000</td>
</tr>
<tr><td>Row:2 Cell:1</td><td>Row:2 Cell:2</td><td>Row:2 Cell:3</td><td>Row:2 Cell:4</td><td>Row:2 Cell:5</td>
<td>5</td>
<td>6</td>
<td>7000000</td>
<td>800000</td>
</tr>
<tr><td>Row:3 Cell:1</td><td>Row:3 Cell:2</td><td>Row:3 Cell:3</td><td>Row:3 Cell:4</td><td>Row:3 Cell:5</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
</tr>
<tr><td>Row:4 Cell:1</td><td>Row:4 Cell:2</td><td>Row:4 Cell:3</td><td>Row:4 Cell:4</td><td>Row:4 Cell:5</td>
<td>13</td>
<td>14000000</td>
<td>15</td>
<td>16</td>
</tr>
<tr><td>Row:5 Cell:1</td><td>Row:5 Cell:2</td><td>Row:5 Cell:3</td><td>Row:5 Cell:4</td><td>Row:5 Cell:5</td>
<td>1700000000</td>
<td>18</td>
<td>19</td>
<td>20</td>
</tr>
<tr><td>Row:6 Cell:1</td><td>Row:6 Cell:2</td><td>Row:6 Cell:3</td><td>Row:6 Cell:4</td><td>Row:6 Cell:5</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr><td>Row:6 Cell:1</td><td>Row:6 Cell:2</td><td>Row:6 Cell:3</td><td>Row:6 Cell:4</td><td>Row:6 Cell:5</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr><td>Row:6 Cell:1</td><td>Row:6 Cell:2</td><td>Row:6 Cell:3</td><td>Row:6 Cell:4</td><td>Row:6 Cell:5</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr><td>Row:6 Cell:1</td><td>Row:6 Cell:2</td><td>Row:6 Cell:3</td><td>Row:6 Cell:4</td><td>Row:6 Cell:5</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<p> </p>
</div>
请帮忙
最佳答案
要使其可滚动，您可以使用 jQuery。
我还没有为您的场景找到确切的解决方案。但是，下面是使标题不滚动的链接。
[类似问题解决方案][1]
[1]: https://jsfiddle.net/dPixie/byB9d/3/light/
关于html - 我想将第一列设为静态并使其可排序？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30467126/