如何在所有浏览器中显示垂直文本(旋转90度)？

Question

如何在所有浏览器中显示垂直文本(旋转90度)？

alt text http://blogs.sun.com/oootnt/resource/sbres_1164126054_0__.png

Answer 1

该问题独立于服务器端语言.如果垂直渲染文本不再是文本而不是图像时不是问题,请选择tharkun提供的解决方案.否则,有一些方法可以在表示层中执行此操作.

首先,(目前)还有一个仅限IE的解决方案,它是CSS3标准的一部分.你可以现场查看.

p {
    writing-mode: tb-rl;
}

该CSS3文本模块还可以指定一些文本取向性.

其他人用SVG做.

Answer 2

我不认为你可以用PHP/HTML/CSS旋转文本.但您可以使用包含垂直文本的GD创建图像.

例:

header ("Content-type: image/png"); 

// imagecreate (x width, y width)
$img_handle = @imagecreatetruecolor (15, 220) or die ("Cannot Create image"); 

// ImageColorAllocate (image, red, green, blue)
$back_color = ImageColorAllocate ($img_handle, 0, 0, 0); 
$txt_color = ImageColorAllocate ($img_handle, 255, 255, 255); 
ImageStringUp ($img_handle, 2, 1, 215, $_GET['text'], $txt_color); 
ImagePng ($img_handle); 
ImageDestroy($img_handle);