Kanbun HTML/CSS Styles

Kanbun styling released under Creative Commons 4.0 (basically: if you use it, even as the basis of your own original code, you must credit me somewhere)

(Best viewed in Chrome, Safari, or Opera)

知 しル   二 天 命 ヲ   一 。

And now flowing with a max height and a nice, white background...

江 南 ニ 多 シ   レ 竹。 其 ノ 人 習     二 食 ラフヲ   一レ 筍 たけのこヲ 。 毎 ごとニ   レ 方 あタル   二 春 ノ 時 ニ   一 、 苞 はう 甲 かふ 出 デ   レ 土 ヨリ 、頭角 繭 けん 栗 りつ 、 率 おほむネ 以 テ 供 ス   二 供採 食 ニ   一 。

Instructions

  1. Download the stylesheet and reference it with <link rel="stylesheet" href="kanbun.css" />
  2. Change the max-height element on kanbunText as you see fit
  3. Put the kanbun text in an element with the class "kanbunText"
  4. Write ruby elements and plain text as normal
  5. For text with kunten of some kind, create two ruby elements in a span with the class "kanbunBox". Give the first the right-side readings, if present. On the second ruby element, enter a non-breaking space as the rb element via &nbsp; and input the kunten on the rt element.

Creative Commons License Kanbun HTML/CSS (漢文のHTML/CSS) by Lani Alden is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.