参考：http://blog.csdn.net/ygm_linux/article/details/18558377
只用于ie的方法(Opera试后也可以)
1. writing-mode（设置对象书写方向）
语法：writing-mode : lr-tb、tb-rl
参数：lr-tb：从左向右，从上往下 tb-rl：从上往下，从右向左
示例：div { writing-mode: tb-rl; }
2. text-align（设置对象中文本的对齐方式）
语法：text-align : left、right、center、justify
参数：left：左对齐 right：右对齐 center：居中 justify：两端对齐
示例：div { text-align : center; }
例子：
<html>
<head>
<title>竖排文字</title>
<style type="text/css">
.tbrl {Writing-mode:tb-rl;Text-align:right;font-size:9pt}
</style>
</head>
<body>
<div class="tbrl">
南唐 李 煜
春花秋月何時了
往事知多少
小樓昨夜又東風
故國不堪回首月明中
雕闌玉砌應猶在
只是朱顏改
問君能有幾多愁
恰似一江春水向東流
</body>
</html>
还有一个vertical-rl，vertical-lr。
writing-mode: vertical-lr;/*从左向右 从右向左是 writing-mode: vertical-rl;*/
writing-mode: tb-lr;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*/
---------------------
适用于主流浏览器
<html>
<head>
<title>竖排文字</title>
</head>
<body>
<div style="font-size:xx-large;font-weight:bold;line-height:1em;width:1.5em; float:right;">虞 美 人
</div>
<div style="width:1.5em; float:right;"> </div>
<div style="width:1.5em; float:right;">南唐 李 煜 </div>
<div style="width:1.5em; float:right;">春花秋月何時了</div>
<div style="width:1.5em; float:right;">往事知多少 </div>
<div style="width:1.5em; float:right;">小樓昨夜又東風 </div>
<div style="width:1.5em; float:right;">故國不堪回首月明中</div>
<div style="width:1.5em; float:right;">雕闌玉砌應猶在 </div>
<div style="width:1.5em; float:right;">只是朱顏改</div>
<div style="width:1.5em; float:right;">問君能有幾多愁 </div>
<div style="width:1.5em; float:right;">恰似一江春水向東流 </div>
</body>
</html>
设置宽度：
<html>
<head>
<title>竖排文字</title>
<style type="text/css">
.tbrl {width:20px;font-size:20px;word-wrap:break-word;letter-spacing:20px;}
</style>
</head>
<body>
<div class="tbrl">
南唐 李 煜
春花秋月何時了
往事知多少
小樓昨夜又東風
故國不堪回首月明中
雕闌玉砌應猶在
只是朱顏改
問君能有幾多愁
恰似一江春水向東流
</body>
</html>
