table固定列html5,css+js简单实现table固定首行首列

说明：

使用easyui等都可以实现table固定首行首列的功能。

但仅仅只需要这一个功能，完全可以用css+js简单实现而不用引入更多工具。

网上找到很多的思路，自己对其中比较简单的一个进行了整理。

大致效果：

Paste_Image.png

页面布局：

Paste_Image.png

如上图：

1、整个页面分成 左右 两部分：

2、左边分为 上下 两部分

3、右边分为 上下 两部分(红色框比较特殊，多加一个div为了防止列的偏移)

具体步骤：

1、html：(省略tr、td)

2、css：

(1)left_div与right_div 使用左浮动

(2)上图蓝色div框，宽度可以都使用100%，跟随左右大的div(left_div与right_div)

(3)left_div2 及 right_div1 需要加上overflow: hidden

(4)防止列错位：right_divx(上图红色div框)的宽度需要大于right_table1及right_t