失眠网 > html css 实现文字竖排模拟古籍排版

html css 实现文字竖排模拟古籍排版

时间：2019-03-26 21:14:45

<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <title>仿古竖排文字</title> <style type="text/css">.verticallines{background-color:#EEAD0E;font-family:"Source Han Serif SC";height:360px;margin:1em;padding:2em;font-size:1em;writing-mode:tb-rl; -webkit-writing-mode:vertical-rl;}.verticallines span{color:red;font-size:2em;float:left;vartical-align:middle;}</style></head><body><div class="verticallines">易音宝典亿忆亦一易一易亦亿忆观世界万千音声悟道空即是色色即是空空不异色色不异空音声有意义无意义皆因人与人人与世界之结缘而成同一音于百千门语言中幻化出无数种语义甚是奥妙而人能分别之语音音素大抵不过百数所以以音声连通异国他族之语义实乃以有限为无限以一当百妙哉妙哉现举数例与众分享以窥是法之玄机 鹦歌狸诗英文鹦鹉聪慧能言亦能歌狐狸狡猾能文亦能诗英国之民有智勇曾称日不落帝国其语为英文 柴泥字中文仓颉伏羲用柴棍在泥地上描绘万物那就是最原初的中文象形文字 兰桂芝语言如兰幽香如桂清香如芝润泽人类的语言也是这样美好 传思类神翻译传递思想类若神明翻译是一种神圣崇高的事业 </div></body> </html>

关键是要注意应用

writing-mode:tb-rl;-webkit-writing-mode:vertical-rl;

float:left;

<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <title>仿古竖排文字</title> <style type="text/css">.verticallines{background-color:#EEAD0E99;font-family:"Source Han Serif SC";height:300px;margin:1em;padding:2em;font-size:1em;writing-mode:tb-rl; //-webkit-writing-mode:vertical-rl;}.bigletters{color:red;font-size:2em;display:inline-block;}.smallletters{font-size:1em;display:inline-block;}.meaning{color:#008080;}</style></head><body><div class="verticallines">易音宝典亿忆亦一易一易亦亿忆亿忆亦一易一易亦亿忆观世界万千音声悟道空即是色色即是空空不异色色不异空音声有意义无意义皆因人与人人与世界之结缘而成同一音于百千门语言中幻化出无数种语义甚是奥妙而人能分别之语音音素大抵不过百数所以以音声连通异国他族之语义实乃以有限为无限以一当百妙哉妙哉现举数例与众分享以窥是法之玄机鹦歌狸诗英文鹦鹉聪慧能言亦能歌狐狸狡猾能文亦能诗英国之民有智勇曾称日不落帝国其语为英文柴泥字中文仓颉伏羲用柴棍在泥地上描绘万物那就是最原初的中文象形文字兰桂芝语言如兰幽香如桂清香如芝润泽人类的语言也是这样美好传思类神翻译传递思想类若神明翻译是一种神圣崇高的事业</div></body> </html>

<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <title>仿古竖排文字</title> <style type="text/css">.verticallines{background-color:#EEAD0E99;font-family:"Source Han Serif SC";height:300px;margin:1em;padding:2em;font-size:1em;writing-mode:tb-rl; -webkit-writing-mode:vertical-rl;}.bigletters{color:red;font-size:2em;float:left;}.smallletters{color:#333333;}.meaning{color:#008080;}</style></head><body><div class="verticallines">易音宝典亿忆亦一易一易亦亿忆亿忆亦一易一易亦亿忆观世界万千音声悟道空即是色色即是空空不异色色不异空音声有意义无意义皆因人与人人与世界之结缘而成同一音于百千门语言中幻化出无数种语义甚是奥妙而人能分别之语音音素大抵不过百数所以以音声连通异国他族之语义实乃以有限为无限以一当百妙哉妙哉现举数例与众分享以窥是法之玄机 鹦歌狸诗英文 鹦鹉聪慧能言亦能歌狐狸狡猾能文亦能诗英国之民有智勇曾称日不落帝国其语为英文 柴泥字 中文 仓颉伏羲用柴棍在泥地上描绘万物那就是最原初的中文象形文字 兰桂芝 语言 如兰幽香如桂清香如芝润泽人类的语言也是这样美好 传思类神 翻译 传递思想类若神明翻译是一种神圣崇高的事业 </div></body> </html>

如果觉得《html css 实现文字竖排模拟古籍排版》对你有帮助，请点赞、收藏，并留下你的观点哦！

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论

网友评论仅供其表达个人看法，并不表明网站立场。