< table>< tbody>可滚动？ [英] <table><tbody> scrollable?
问题描述
我想在右边有一个带有滚动条的表。
我想用css完成这个没有任何插件（jQuery）。
表头是
I would like to have a table with a scrollbar to the right.
I want to accomplish this without any plugins(jQuery) just with css.
The table header is supposed to stay fixed.
我需要做什么才能使这项工作？
What do I need to do to get this working?
推荐答案
你已经承担了一个任务，如果你成功了，会让你成为一个英雄。我试过这个和直截了当的事情 - 位置：固定; < thead> - 是不可能的。我不得不将所有的< thead>复制到一个新的对象。但是当你这样做时，第th个元素的水平间距都消失，所以标题不再与td对齐。我最终做了这样的事情：
You have taken on a task that, if you succeed, will make you a hero. I tried this and the straightforward thing -- to position:fixed; the <thead> -- is impossible. I had to copy all of the <thead> into a new object. But when you do that, the horizontal spacing of the <th> elements all goes away so the headings don't line up with the <td>s anymore. I ended up doing something like this:
首先，放弃ie6和ie7。这些人没有希望。
First of all, abandon ie6 and ie7. There's no hope for those guys.
-
制作两张表格，一张是身体不可见，另一张是< >是可见的，而另一个是反之亦然。
Make two copies of the table, one where the body is invisible and the <thead> is visible, and the other where it's vice-versa.
指定z-index：1;
Give z-index:1; to the table with the visible <thead>.
指定z-index：0;
Give z-index:0; to the table with the visible <tbody>.
处理水平滚动，但直到找到onScroll不是ie8事件提到ie6），所以你必须每隔十分之一秒钟就进行一次setInterval break 来处理在ie8中滚动< thead>左右。
Deal with horizontal scrolling, but not until after you find that onScroll isn't an ie8 event (not to mention ie6), so that you have to take a setInterval break every tenth of a second or so just to handle scrolling the <thead> left and right in ie8.
这将给你一个在两个轴上无限滚动的表体，只有一个表头在x轴上滚动。适用于FF，Chrome和Safari。但是在ie8是摇摇欲坠。一个真正的皮塔。
This will give you a table body of infinite scroll in both axes, with a table head that scrolls in the x axis only. Pretty much works in FF, Chrome, and Safari. But is shaky in ie8. A real pita.
祝你好运，如果你得到这个工作，请写！
Good luck, and please write if you get this to work!
这篇关于< table>< tbody>可滚动？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
