竖排文字的基本模式 用CSS属性书写的基本代码 <DIV style="WRITING-MODE: tb-rl"> <FONT style="FONT-WEIGHT: normal; FONT-SIZE: 22pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" color=#ff0000>满江红<BR>岳飞<BR>怒发冲冠,<BR>凭栏处潇潇雨歇。<BR>抬望眼, <BR> 仰天长啸,<BR>壮怀激烈。<BR>三十功名尘与土,<BR>八千里路云和月。<BR>莫等闲白了少年头,<BR>空悲切。<BR>靖康耻,<BR>犹未雪;<BR> 臣子恨,<BR>何时灭!<BR>驾长车踏破贺兰山缺。<BR>壮志饥餐胡虏肉,<BR>笑谈渴饮匈奴血。<BR>待从头收拾旧山河,<BR>朝天阙。<BR> </FONT></DIV> 显示效果图 满江红 岳飞 怒发冲冠, 凭栏处潇潇雨歇。 抬望眼, 仰天长啸, 壮怀激烈。 三十功名尘与土, 八千里路云和月。 莫等闲白了少年头, 空悲切。 靖康耻, 犹未雪; 臣子恨, 何时灭! 驾长车踏破贺兰山缺。 壮志饥餐胡虏肉, 笑谈渴饮匈奴血。 待从头收拾旧山河, 朝天阙。
说明: DIV style= 定义css样式表标记 WRITING-MODE:布局属性名称 属性值 tb-rl 定义 垂直,表示至上而下、从右向左。 rl-tb 定义水平 每行竖排字体结束,要在后面加一个换行标记<BR> 可以调整竖排文字的行距和字距的代码 <DIV style="LINE-HEIGHT: 2em; LETTER-SPACING: 0.2em; WRITING-MODE: tb-rl"> <FONT style="FONT-WEIGHT: normal; FONT-SIZE: 18pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" color=#0000ff>满江红<BR>岳飞<BR>怒发冲冠,<BR>凭栏处潇潇雨歇。<BR>抬望眼,<BR> 仰天长啸,<BR>壮怀激烈。<BR>三十功名尘与土,<BR>八千里路云和月。<BR>莫等闲白了少年头,<BR>空悲切。<BR>靖康耻,<BR>犹未雪;<BR>臣子恨,<BR>何时灭!<BR>驾长车踏破贺兰山缺。<BR>壮志饥餐胡虏肉,<BR>笑谈渴饮匈奴血。<BR>待从头收拾旧山河,<BR>朝天阙。<BR> </FONT></DIV> 显示效果图 满江红 岳飞 怒发冲冠, 凭栏处潇潇雨歇。 抬望眼, 仰天长啸, 壮怀激烈。 三十功名尘与土, 八千里路云和月。 莫等闲白了少年头, 空悲切。 靖康耻, 犹未雪; 臣子恨, 何时灭! 驾长车踏破贺兰山缺。 壮志饥餐胡虏肉, 笑谈渴饮匈奴血。 待从头收拾旧山河, 朝天阙。
说明 LINE-HEIGHT: 2.0em 调整文字水平行间距.数值可调整。 LETTER-SPACING: 0.2em 调整文字垂直间距. 数值可调整。 注:上面的效果图有一个问题,就是有些行竖排文字多了会自动折行、影响竖排字体的美观。 只要加一个表格一行一列的代码,做一个图框套装,宽度定为700不变,高度视每行字多少而定。 图框套装代码: <TABLE borderColor=#6495ED height=300 cellSpacing=3 cellPadding=1 width=700 align=center border=15> <TBODY> <TR> <TD> <DIV style="LINE-HEIGHT: 2em; LETTER-SPACING: 0.2em; WRITING-MODE: tb-rl"><FONT style="FONT- WEIGHT: normal; FONT-SIZE: 22pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" color=#ff0000>满江红<BR>岳飞<BR>怒发冲冠,<BR>凭栏处潇潇雨歇。<BR>抬望眼,<BR>仰天长啸,<BR>壮怀激烈。<BR>三十功名尘与土,<BR>八千里路云和月。<BR>莫等闲白了少年头,<BR>空悲切。<BR>靖康耻,<BR>犹未雪;<BR>臣子恨,<BR>何时灭!<BR>驾长车踏破贺兰山缺。<BR>壮志饥餐胡虏肉,<BR>笑谈渴饮匈奴血。<BR>待从头收拾旧山河,<BR>朝天阙。<BR> </FONT></DIV></TD></TR></TBODY></TABLE> 看看效果,是不是每行竖排文字不自动折行了!!! 满江红 岳飞 怒发冲冠, 凭栏处潇潇雨歇。 抬望眼, 仰天长啸, 壮怀激烈。 三十功名尘与土, 八千里路云和月。 莫等闲白了少年头, 空悲切。 靖康耻, 犹未雪; 臣子恨, 何时灭! 驾长车踏破贺兰山缺。 壮志饥餐胡虏肉, 笑谈渴饮匈 奴血。 待从头收拾旧山河, 朝天阙。
| 说明: 这是表格图框套装代码 <TABLE borderColor=#6495ED height=300 cellSpacing=3 cellPadding=1 width=700 align=center border=15> <TBODY> <TR> <TD>
|
评论