中文字段的几种特殊排列方式

| No Comments | No TrackBacks

  1.文字倒排(向左卧倒,逆时针转90度)<br><br>

<span style="font-family:@宋体;color:red">尽人事 顺天命</span>

 <br><br>
 2.文字正写竖排,中文竖排,从右往左读(见右面)<br><br>
 <div style="layout-flow: vertical-ideographic;height:399;float:right;">
 在暗蓝色的海上,海水在欢快地泼溅<br>
 我们的心是自由的,我们的思想无边<br>
 这全是我们的帝国,它的权力到处通行<br>
 我们的旗帜就是王笏,谁碰到都得服从<br>
 我们过着粗犷的生涯,在风暴动荡里<br>
 从劳作到休息,什么样的日子都有乐趣<br>
 噢,谁能体会出?可不是你,娇养的奴仆<br>
 可不只有“无路之路”的游荡者才能知道?<br>
 在红色的酒杯中旋起我们的记忆<br>
 当胜利的伙伴们终于把财物平分<br>
 谁不落泪,当回忆暗淡了每人的前额:<br>
 现在,那倒下的勇士该会怎样地欢欣!<br></div>
 

 <br><br>
 3.文字倒写竖排<br><br>
 <br>
 <script langauge="javascript">
       var oNum = 0;
       function showText(){
           var strText = '文字还有倒着竖排的?';
           var oDiv = document.all['oDiv'];
           oDiv. innerHTML = strText.substr(0, oNum);
           oNum = (oNum>strText.length) ? 0 : oNum+1 ;
           window.setTimeout('showText()', 500);
       }
       window.onload = function(){ window.setTimeout('showText();', 500); }
 </script>
 <div id="oDiv" style="width:25px;height:180px;direction:rtl;unicode-bidi:bidi-override;layout-flow:vertical-ideographic;text

-align:right;"></div>

<br>
 4.中文竖排,从左往右读:<br>
 <style>div {display:inline;color:red; font:11pt 华文行楷; writing-mode:tb-rl;}</style>
 <div>下定决心,</div>
 <div>不怕牺牲,</div>
 <div>排除万难,</div>
 <div>争取胜利!</div>

<br><br>
 5.两种竖排的:<br>

<div style="width:5px;float:left;"><font face="@隶书" size="5px" color="red">只要你坚持不懈什么样的结果都有可能</font></div>
 <div style="position:absolute;filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);float:right;"><font face="华文行楷" size="5px" color="blue">只要你坚持不懈什么样的结果都有可能</div><br>
 <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
 6.文字段的反向排列<br>
 <script type="text/javascript">//
 function
 scbg(objRef, state)
 {
     objRef.style.backgroundColor = (1 == state) ? '#EEEEEE' : '#FFFFFF';

    return;
 }
 //</script>

<table>
 <tr>
 <td onmouseout="scbg(this, 0);" onmouseover="scbg(this, 1);" width="152" height="300">

<center>
 <bdo dir="rtl">WWW.FLYSO.NET</bdo></td>
 </tr>
 </table>

No TrackBacks

TrackBack URL: http://www.wujianrong.com/mt-tb.cgi/2488

Leave a comment

About this Entry

This page contains a single entry by kevinwu published on May 13, 2007 10:58 AM.

一段完全CSS写的鼠标悬停tip效果! was the previous entry in this blog.

绝对优秀的点图效果 is the next entry in this blog.

Find recent content on the main index or look in the archives to find all content.