如何在表格单元格中垂直对齐文本？

Question

我已经在许多不同的论坛上搜索了数小时的网络，但是似乎没人能找到我需要的答案。 如何在表格单元格中垂直对齐文本？ 这样：但没有空格

V

Ë

[R

Ť

一世

C

一种

大号

这是我的代码：

 .VerticalText { -ms-writing-mode: tb-lr; -webkit-writing-mode: vertical-lr; -moz-writing-mode: vertical-lr; } 

 <table width="98%" border="1" style=""> <tbody> <tr> <table width="98%" border="1" style=""> <tbody> <tr> <td rowspan="2">TEXT</td> <td rowspan="2">TEXT</td> <td colspan="7" align="center">TEXT</td> <td rowspan="2">TEXT</td> </tr> <tr> <td class="VerticalText">TEXT</td> <td>VERTICAL TEXT</td> <td>VERTICAL TEXT</td> <td>VERTICAL TEXT</td> <td>VERTICAL TEXT</td> <td>VERTICAL TEXT</td> <td>VERTICAL TEXT</td> </tr> </tbody> </table> 

我尝试了文本方向，文本方向等。

我迷路了，有人可以帮忙吗？

Answer 1

您可以将文本包裹在一个span ，使它成为一个块元素，并给它一个很小的width （这样一来就只能容纳一个字母），而且还可以word-break: break-all; ，因此这些单词实际上分为单个字母。 （在下面的示例中，我将更改后的.VerticalText类分配给了span元素）

 .VerticalText { display: block; width: 0.9em; word-break: break-all; } 

 <table width="98%" border="1" style=""> <tbody> <tr> <table width="98%" border="1" style=""> <tbody> <tr> <td rowspan="2">TEXT</td> <td rowspan="2">TEXT</td> <td colspan="7" align="center">TEXT</td> <td rowspan="2">TEXT</td> </tr> <tr> <td>TEXT</td> <td><span class="VerticalText">VERTICAL TEXT</span></td> <td><span class="VerticalText">VERTICAL TEXT</span></td> <td><span class="VerticalText">VERTICAL TEXT</span></td> <td><span class="VerticalText">VERTICAL TEXT</span></td> <td><span class="VerticalText">VERTICAL TEXT</span></td> <td><span class="VerticalText">VERTICAL TEXT</span></td> </tr> </tbody> </table>