css实现表格的td里面的内容居中.

html-css07

css实现表格的td里面的内容居中.,第1张

<td

align="center"

valign="middle">

前一个是水平居中

后一个是垂直居中

对应的css写法:

<td

style="text-align:centervertical-align:middle">

文字垂直居中的有如下的方法

方法一:valign:middle

代码如下:

<table>

<tbody>

<tr>

<td valign="middle">垂直居中</td>

</tr>

</tbody>

</table>

方法二:style="display:table-cell vertical-align:middle"

代码如下:

<table>

<tbody>

<tr>

<td style="display:table-cell vertical-align:middle">垂直居中</td>

</tr>

</tbody>

</table>

方法三:style="height:20px/*高度根据实际情况设置*/ line-height:22px/*根据实际情况设置到达垂直居中即可*/"

<table>

<tbody>

<tr>

<td style="height:20px/*高度根据实际情况设置*/ line-height:22px/*根据实际情况设置到达垂直居中即可*/">垂直居中</td>

</tr>

</tbody>

</table>

我表示完全没问题。

<style>

td{

padding:0px

text-align:left

vertical-align:top

}

</style>

<body>

<table width="256" height="173">

<tr>

<td rowspan="2">123</td>

<td>123</td>

</tr>

<tr>

<td>123</td>

</tr>

<tr>

<td>123</td>

<td>123</td>

</tr>

</table>

</body>