han-css/test/deco-line.jade

The CSS typography framework optimised for Hanzi

doctype html
html(lang='zh-Hant').han-init
  head
    meta(charset='utf-8')
    title 測試・文字裝飾線元素 — 漢字標準格式
    link(rel='stylesheet', href='./han.min.css')

    style.
      html {
        overflow-x: hidden;
      }

      article {
        /* position */
        margin: 0 auto;

        /* box */
        max-width: 35em;
        padding: 0 .5em 15em;
      }
    meta(name='viewport' content='width=device-width, initial-scale=1.0')
    meta(name='description' content='印刷品般的漢字網頁排版框架')
    meta(name='keywords' content='漢字標準格式, 中文, 排版, 排版規範, 日文, 字體排印, 文字設計, CLReq, CSS, Sass, typography')

  body.test

    article
      h1 測試·文字裝飾線元素
      section#dixian
        h2 底線
        section#zhuji_yuansu
          h3 註記元素<code>u</code>
          p
            u.pn 詹姆斯·貝內特·麥克里
            | 是<u class='pn'>美國</u><u class='pn'>肯塔基州</u><!--
            | -->的一名律師和政治家，曾是該州在<u class='pn'>聯邦國會</u>兩院的代表並擔任第27和第37任州長。

        section#zengding_yuansu
          h3 增訂元素<code>ins</code>
          p
            | 那個男孩<ins datetime='2014-7-1'>說</ins><ins datetime='2014-7-2'>道</ins>：「<span lang='es'>¡Te quiero!</span>」

      section#shanchuxian
        h2 刪除線
        section#exun_yuansu
          h3 訛訊元素<code>s</code>
          p
            | 呼叫器（<span lang='en'>pager</span>，又作B.B.Call）是<s>當今世代最有效的</s>交流、溝通設備之一。
        section#shanding_yuansu
          h3 刪訂元素<code>del</code>
          p
            | 歡迎——<!--
            | --><del datetime='1995'>抄寫、</del><!--
            | --><del datetime='2010'>列印或</del><!--
            | -->傳送這分文件到行動裝置<!--
            | -->以便査閱。
      section#hunyong
        h2 混用
        p
          | <u>註記元素甲</u><ins>增訂元素甲</ins><u>註記元素乙</u><!--
          | -->一般文字節點<!--
          | --><ins>增訂元素乙</ins><u>註記元素丙</u><ins>增訂元素丙</ins><!--
          | -->一般文字節點；<!--
          | --><s>訛訊元素甲</s><del>刪訂元素甲</del><s>訛訊元素乙</s><!--
          | -->一般文字節點<!--
          | --><del>刪訂元素乙</del><s>訛訊元素乙</s><del>刪訂元素丙</del>。
        p
          | <u>註記元素丁</u><s>訛訊元素丁</s><ins>增訂元素丁</ins><del>刪訂元素丁</del>。

    // Here goes scripts
    script(src='./han.min.js')