html 如何让一个表的前几列固定,不随着滚动条移动?

html-css07

html 如何让一个表的前几列固定,不随着滚动条移动?,第1张

1、如图,一个没有经过固定操作的电子表格,当随着表格被拖动或滚动,需要被固定的首行或首列的信息也跟着滚动消失了。

2、首先打开excel文档,假设我们需要让表格的前两行内容在表格滚动时固定在表格顶部,即第3行与第4行不变。

3、首先将鼠标移动到O5单元格(要固定的行的下一行最旁边一个单元格内),并单击,使该单元格处于被选中状态。

4、保持光标停留位置处于O5单元格,依次选择工具栏中的“视图”-“冻结窗格”-

5、单击“冻结拆分窗格”。

6、回到文档,继续拖动或滚动表格,会发现第3、4行已经被固定在此位置。至此所有操作完成,过程很简单。

css中宽度和高度分别可以通过width和height实现,那么对于单元格的宽度和高度,则可以通过如下样式来设置

td{

width:100px

height:50px}

/*设置单元格宽度100px,高度50px*/

示例如下:

给出html元素

1

2

345

6789

10

11

设置单元格高度和宽度样式

table{border-collapse:collapse}

td{

border:

1px

solid

green

/*边框*/

width:100px

/*单元格宽度*/

height:50px

/*单元格高度*/

text-align:center

/*单元格文字居中对齐*/