鍍金池/ 問答/HTML/ css table如何讓每條數(shù)據(jù)有橫向滾動條？

css table如何讓每條數(shù)據(jù)有橫向滾動條？

<div overflow="auto">
  <table>
     <tbody>
        <tr>
           <td>xx</td>
           <td>oo</td>
           ...
        </tr>
     </tbody>
  </table>
</div>

我這的場景是，table要顯示的數(shù)據(jù)很多，要求又不能換行，只能table使用橫向滾動條，
由于現(xiàn)在數(shù)據(jù)太多，每次要拉到最底下才能滑滾動條，現(xiàn)在需求是給每條數(shù)據(jù)加滾動條，有什么好的方法實現(xiàn)嗎？

——————————————————
謝謝各位

回答
編輯回答
情未了

個人覺得給每條數(shù)據(jù)加橫向滾動條可以考慮overflow，但是很丑。。
是不是可以考慮一下，table的高度設(shè)置在窗口可視高度范圍，這樣上下拖動滾動條不會太麻煩。
比如瀏覽器窗口高度假設(shè)700，那么table高度設(shè)置700范圍內(nèi)，一個窗口可以看完整個table，在table內(nèi)上下滾動和橫向滾動，體驗應(yīng)該比每條橫向滾動要好。

2018年3月31日 08:34
編輯回答
礙你眼

在table外面包裹一層div，然后在這個div上設(shè)置橫向滾動條。
table的width不要設(shè)置死。
div的寬度設(shè)置成你布局需要的width。

2018年1月3日 19:15
編輯回答
哚蕾咪

給tr加 overflow-x:auto 不過不曾見過有網(wǎng)站這么干的。應(yīng)該會非常丑。
你的方向應(yīng)該是控制表格外層的滾動，也就是給表格加高度，超過時垂直方向滾動，就不存在拖動數(shù)據(jù)到最下面的問題
總之就是 外層表格的橫向與縱向都要自己加滾動條

2018年9月21日 05:57