如何仅使用 CSS 创建垂直文本？

Question

是否可以仅使用 CSS 创建垂直文本，并兼容 IE6+？

我所说的垂直是指

F
O
O

B
A
R

Answer 1

已编辑：您可以尝试以下操作：

p {
  letter-spacing: 1000px;    // more than width of parent 
  word-wrap: break-word;    // seems to work in at least Firefox and IE7+ 
}

这似乎适用于 Firefox 3.5 和 IE7+（目前无法访问 IE6）。该解决方案唯一缺少的是一个额外的空格换行，结果类似于：

F
哦
哦
B
一个
右

Answer 2

如今，以与浏览器无关的方式实现这一点是不可能的。等待CSS3。

Answer 3

这在 IE 中有效，但不幸的是在 FF 中无效：

.verticaltext 
{
    writing-mode: tb-rl;
    filter: fliph flipv;
}

Answer 4

您可以使用此 CSS 实现类似的功能（至少在 IE 中）：

.verticaltext {
  writing-mode: tb-rl;
}

但这会将字符顺时针旋转 90 度。