css表格,如何使表格内的单td列宽度固定,且表格总体带滚动条?

html-css07

css表格,如何使表格内的单td列宽度固定,且表格总体带滚动条?,第1张

给你提供个思路,在表格里套表格:把除第一行和第一列外的td合并,然后在里面添加一个

<div>

<table>

</table>

</div>

其中table里放什么东西自己定,最后设计CSS:

给div设定一个宽度和一个高度,并设置overflow:auto属性

这样就会根据你table里的内容自动出现滚动条,但有一点,滚动条是在div标签出现,而不是你提供的图片那样(在外部表格的"局部"出现(这种估计实现不了))

1、首先给table标签添加css : table-layout:fixed这里是为了让整个table有一个自己宽度,而不是让table自己随着自己内容的大小而改变。

2、给table标签,定一个宽度(如:width:500px)

3、最后给td 定一个宽度(width)就可以实现.

原表格:

添加一下CSS:

现表格:

扩展资料:

在实际需求中,经常遇到要在table中的td中,让用户输入比较长的字符串,这时就要使td的宽度能较大。

在WEB前端中,对于 表格元素中的元素td 直接设置宽度是无法生效的。要想达到给td设置宽度的目地。