HTML中表格合并单元格后怎么把文字垂直居中？_随笔

HTML中表格合并单元格后文字垂直居中的方法：给单元格样式加上 valign="middle"，文字就垂直居中对齐了

HTML表格属性：

border：此属性定义表格的边框。比如，border=1，表示表格边框的粗细为1个像素（默认值），为0表示没有边框。

cellspacing：单元格间距。当一个表格有多个单元格时，各单元格的距离就是cellspacing了，如若表格只有一个单元格，那么，这个单元格与表格上、下、左、右边边框的距离也是cellspacing。

cellpadding：单元格衬距。指该单元格里的内容与cellspacing区域的距离，如果cellspacing为0，则表示单元格里的内容与表格周边边框的距离。

width：表格的宽度。取值从0开始，默认以像素为单位，与显示器的分辨率的像素是一致的。800×600的显示分辨率下，如果表格设置成1000个像素的宽度，那么，得出的效果将导致IE的横向滚动条出现，只有通过滑动它才能看到表格最右边的内容，所以建议在设置表格的宽度时充分考虑显示分辨率问题。width的取值还可以使用百分比，如widht="100%"，这种赋值法有个好处：表格的宽度将根据可显示的宽度来自我调整宽度。

height：表格的高度，取值方法同width。提示：如果不是特别需要，建议不用设置表格的高度，系统会根据表格的内容自动设置高度。所谓特别的需要，是指一些特殊的情形下，需要表格的高度精确，比如，当我们通过表格的背景来发一张图片时，如果表格的高度不精确定义，图片就不可能完整或完美地显示。

bgcolor：表格的背景色。取值方法举例：bgcolor=#ff0000或bgcolor=red。单元格<td>也可有此属性，如果设置了表格的背景色，又设置表格单元格的背景色，得出的效果将是值得试试的，这种情况主要用于多单元格的表格。

background：表格的背景图。其值为一个有效的图片地址。<td>也有此属性。同时设置背景色和背景图不冲突，也建议这么做，这样，当图片不能显示时，表格的外观依然是好看的。

bordercolor：表格的边框颜色，当border值不为0时设置此值有效。取值同bgcolor。

bordercolorlight：亮边框颜色，当border值不为0时设置此值有效。亮边框指表格的左边和上边的边框。

bordercolordark：暗边框颜色，当border值不为0时设置有效。暗边框指表格的右边和下边的边框。

align：表格的对齐方式，值有left（左对齐，默认）、center（居中）以及right（右对齐）。align定义的是表格自身的位置，这是一个很有用的属性，强烈建议使用它来规定表格的对齐方式，尽量不要使用<p align=?>表格</p>、<div align=?>表格</div>和<center>表格</center>之类的标签来规定表格的位置，因为这么做将导致论坛添加许多废码！此外，当表格的宽度设置为100%，或者，表格的宽度设置成了占满它所在的容器的宽度，没有必要定义align属性。

在html中将框内的文字既垂直居中又水平居中的 *** 作步骤如下：

1、首先创建一个盒子，并在中间输入文字信息。

2、然后对盒子添加了边框颜色后，这时文字在左侧第1行位置。

3、输入text-align 这个文字的对齐样式，然后在属性中输入center中间的意思，就是将文字在水平位置居中。

4、这样就是文字在水平位置上居中了。

5、根据不同的需要调整line值，这里使用的是行高将其设置为垂直居中，行高的属性是line-height，后面的属性值设置和父级的盒状标签高度相同，这样就可以做到文字垂直方向上居中。

6、设置完后可以看文字既垂直居中又水平居中，这样在html中将框内的文字既垂直居中又水平居中的问题就解决了。

代码如下：

<html>

<body>

<tr>

表格剧中

</td>

表格剧中

</td>

表格剧中

</td>

</tr>

</table>

</body>

</html>

说明：

align="center"

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/zaji/6268088.html

HTML中表格合并单元格后怎么把文字垂直居中？

发表评论

评论列表（0条）