table中如何用CSS控制<tr>><td>的宽度和高度

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

2、给table标签，定一个宽度（如：width:500px）

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

原表格：

添加一下CSS：

现表格：

扩展资料：

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

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

<td>ID是指元素的某个特定id ，比如样式中，特定某个值，类似属性有：class, title, style, dir, lang, , name等，也也可以通过JavaScript 调取TD属性通过ID改变TD的BGCOLOR值，代码例如：<script language=\\"javascript\\">var docBody=nullfunction MouseBgColor(tdid){docBodyTd=document.getElementById(tdid)if(!docBody){return}docBody.style.background='#E1F4EE'}</script><td id=\\"list\\" onclick=\\"MouseBgColor('list')\\">答案补充可以利用javascript脚本，onclick行为，改变指定id的单元格属性

td

{

text-align:center

/*设置水平居中*/

vertical-align:middle/*设置垂直居中*/

}

monday

tuesday

wednesday

thursday

friday

satarday

sunday

friday

satarday

说明：如果要在css中控制标签中的文字垂直居中，那么可以设置td标签选择器下的属性：vertical-align

这个属性有三个值：top

，bottom，middle

其中，middle属性值代表垂直居中。

代码：td

{

vertical-align:middle

}

---