文字豎立排版,方法一
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>數據</title> <link href='http://cdn.webfont.youziku.com/webfonts/nomal/16398/46055/58f85e44f629d8113ccf3119.css' rel='stylesheet' type='text/css' /> <style> div { margin: 0 auto; width: 30px; line-height: 30px; height: 490px; font-size: 24px; float: right; margin-right: 10px }</style> </head> <body class="cssa2f598364400e"> <div> 龍馬花雪毛,金鞍五陵豪。 秋霜切玉劍,落日明珠袍。 </div> <div> 斗雞事萬乘,軒蓋一何高。 弓摧南山虎,手接太行猱。 </div> <div> 酒后競風采,三杯弄寶刀。 殺人如剪草,劇孟同游遨。 </div> <div> 發憤去函谷,從軍向臨洮。 叱吒萬戰場,匈奴盡奔逃。 </div> <div> 歸來使酒氣,未肯拜蕭曹。 羞入原憲室,荒淫隱蓬蒿。 </div> </body> </html>
效果:
方法二:
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>數據</title> <link href='http://cdn.webfont.youziku.com/webfonts/nomal/16398/46055/58f85f0bf629d8113ccf311b.css' rel='stylesheet' type='text/css' /> <style> div { width: 800px; height: 800px; writing-mode: tb-rl; font-size: 24px; float: right } </style>
</head> <body class="cssa2f5c8c5e400e"> <div> 壬戌之秋, 七月既望, 蘇子與客泛舟游於赤壁之下。 清風徐來, 水波不興。 舉酒屬客, 誦明月之詩, 歌窈窕之章。 少焉, 月出於東山之上, 徘徊於斗牛之間。 白露橫江, 水光接天。 縱一葦之所如, 凌萬頃之茫然。 浩浩乎如馮虛御風, 而不知其所止; 飄飄乎如遺世獨立, 羽化而登仙。 於是飲酒樂甚, 扣舷而歌之。 歌曰: “桂棹兮蘭槳, 擊空明兮溯流光。 渺渺兮於懷, 望美人兮天一方。” 客有吹洞蕭者, 倚歌而和之, 其聲嗚嗚然: 如怨如慕, 如泣如訴; 余音裊裊, 不絕如縷; 舞幽壑之潛蛟, 泣孤舟之嫠婦。 蘇子愀然, 正襟危坐, 而問客曰: “何為其然也?” 客曰: “月明星稀, 烏鵲南飛, 此非曹孟德之詩乎? 西望夏口, 東望武昌。 山川相繆, 郁乎蒼蒼; 此非孟德之困於周郎者乎? 方其破荊州, 下江陵, 順流而東也, 舳艫千里, 旌旗蔽空, 釃酒臨江, 橫槊賦詩; 固一世之雄也, 而今安在哉? 況吾與子, 漁樵於江渚之上, 侶魚蝦而友糜鹿, 駕一葉之扁舟, 舉匏樽以相屬; 寄蜉蝣與天地, 渺滄海之一粟。 哀吾生之須臾, 羡長江之無窮; 挾飛仙以遨游, 抱明月而長終; 知不可乎驟得, 托遺響於悲風。” 蘇子曰: “客亦知夫水與月乎? 逝者如斯, 而未嘗往也; 盈虛者如彼, 而卒莫消長也。 蓋將自其變者而觀之, 而天地曾不能一瞬; 自其不變者而觀之, 則物於我皆無盡也。 而又何羡乎? 且夫天地之間, 物各有主。 苟非吾之所有, 雖一毫而莫取。 惟江上之清風, 與山間之明月, 耳得之而為聲, 目遇之而成色。 取之無禁, 用之不竭。 是造物者之無盡藏也, 而吾與子之所共適。” 客喜而笑, 洗盞更酌, 餚核既盡, 杯盤狼藉。 相與枕藉乎舟中, 不知東方之既白。 </div> </body> </html>
效果:
