文字竖排演示
这是一个演示网页,用于呈现古文样式的文字竖排效果,但是它的浏览器兼容性并不完美。
古文中不使用标点,也没有英文字母和阿拉伯数字,这些都是现在竖排文本需要考虑到的。在本页的文字竖排演示中,半角数字和字母将被顺时针旋转90度,至于标点下面将会介绍。
竖排文稿与横排文稿使用标点符号的不同
1、句号、问号、叹号、逗号、顿号、分号和冒号放在字下偏右。
2、破折号、省略号、连接号和间隔号放在字下居中。
3、引号改用双引号『』和单引号「」。
4、着重号标在字的右侧,专名号和浪线式书名号标在字的左侧。
接下来会放上一个文字输入框,你可以在里面尝试输入各种字符,看看出来的效果会是怎样的?
北宋·苏轼《水调歌头·明月几时有》
明月几时有?把酒问青天。
不知天上宫阙,今夕是何年?
我欲乘风归去,又恐琼楼玉宇,高处不胜寒。
起舞弄清影,何似在人间?
转朱阁,低绮户,照无眠。
不应有恨,何事长向别时圆?
人有悲欢离合,月有阴晴圆缺,此事古难全。
但愿人长久,千里共婵娟。
明月几时有?把酒问青天。
不知天上宫阙,今夕是何年?
我欲乘风归去,又恐琼楼玉宇,高处不胜寒。
起舞弄清影,何似在人间?
转朱阁,低绮户,照无眠。
不应有恨,何事长向别时圆?
人有悲欢离合,月有阴晴圆缺,此事古难全。
但愿人长久,千里共婵娟。
右侧输入文字↑ 选择字体:
左侧实时显示↓ 字体大小:
这个网页是怎么实现的?
本页面实现竖排文字是使用了CSS属性:“writing-mode”。IE5.5 浏览器最早开始支持 writing-mode 属性,后期被 W3C 在 CSS2 采纳为标准属性。writing-mode 属性有三个值:
- horizontal-tb:横排版,从左向右书写,向下换行(默认值);
- vertical-rl:竖排版,从上向下书写,向左换行(古代汉字竖排方式);
- vertical-lr:竖排版,从上向下书写,向右换行(主要用于蒙古语和满语等)。
如果要兼容IE浏览器则使用其私有值:
- lr-tb:类似于标准值 horizontal-tb
- tb-rl:类似于标准值 vertical-rl
千千秀字 QQXIUZI.CN