CSS Vertical Text(三种方式)

http://stackoverflow.com/questions/1080792/how-to-draw-vertical-text-with-css-cross-browser

http://www.ssi-developer.net/css/vertical-text.shtml

http://snook.ca/archives/html_and_css/css-text-rotation

http://dev.opera.com/articles/view/css3-transitions-and-2d-transforms/

http://grasshopperpebbles.com/css/vertical-text-with-css/

http://www.thecssninja.com/css/real-text-rotation-with-css

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

<style type="text/css"> .geovindu { /*1涂聚文*/ writing-mode: tb-rl; -moz-transform:rotate(-270deg); -moz-transform-origin: bottom left; -webkit-transform: rotate(-270deg); -webkit-transform-origin: bottom left; -o-transform: rotate(-270deg); -o-transform-origin:  bottom left;   /*2.涂聚文*/ -moz-transform:rotate(-270deg);  -moz-transform-origin:bottom left; -webkit-transform: rotate(-270deg); -webkit-transform-origin: bottom left; -o-transform: rotate(-270deg); -o-transform-origin: bottom left; filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); /*3.涂聚文*/        display: block;        position: absolute;        right: -5px;        top: 15px;        -webkit-transform: rotate(-90deg);        -moz-transform: rotate(-90deg); } </style> <!--[if IE]>    <style type="text/css">     .geovindu {      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);      right:-15px; top:5px;     }    </style>    <![endif]-->

IE,Opera,FireFox主流浏览器测试成功!