han-css
Version:
The CSS typography framework optimised for Hanzi
13 lines (11 loc) • 2.19 kB
HTML
<html lang="zh-Hant" class="han-init"><head><meta charset="utf-8"><title>測試・標音（注音符號、羅馬拼音） — 漢字標準格式</title><link rel="stylesheet" href="./ruby(ff)-han.css"><style>html {
overflow-x: hidden;
}
article {
/* position */
margin: 0 auto;
/* box */
max-width: 35em;
padding: 0 .5em 15em;
}</style><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="description" content="印刷品般的漢字網頁排版框架"><meta name="keywords" content="漢字標準格式, 中文, 排版, 排版規範, 日文, 字體排印, 文字設計, CLReq, CSS, Sass, typography"></head><body class="test"><article><h1>測試·標音（注音符號、羅馬拼音）</h1><section id="zhuyin_fuhao"><h2>注音符號</h2><section id="zhuyin_fuhao-heiti"><h3>黑體</h3><p>ㄅㄆㄇㄈㄉㄊㄋㄌㄍㄎㄏㄐㄑㄒㄓㄔㄕㄖㄗㄘㄙ<br>ㆠㆣㆢㆡㆭ<br>ㄧㄨㄩ<br>ㄚㄛㄜㄝㄞㄟㄠㄡㄢㄣㄤㄥㄦ<br>ㆤㆥㆦㆧㆨㆩㆪㆫㆬㆮㆯㆰㆱㆲㆳ<br>ㄪㄫㄬㄭ<br>ˊˇˋ˪˫˙<br>ㆴㆵㆶㆷㆴ͘ㆵ͘ㆶ͘ㆷ͘</p></section><section id="zhuyin_fuhao-kaiti"><h3>楷體</h3><p>ㄅㄆㄇㄈㄉㄊㄋㄌㄍㄎㄏㄐㄑㄒㄓㄔㄕㄖㄗㄘㄙ<br>ㆠㆣㆢㆡㆭ<br>ㄧㄨㄩ<br>ㄚㄛㄜㄝㄞㄟㄠㄡㄢㄣㄤㄥㄦ<br>ㆤㆥㆦㆧㆨㆩㆪㆫㆬㆮㆯㆰㆱㆲㆳ<br>ㄪㄫㄬㄭ<br>ˊˇˋ˪˫˙<br>ㆴㆵㆶㆷㆴ͘ㆵ͘ㆶ͘ㆷ͘</p></section></section><section id="luoma_pinyin"><h2>羅馬拼音</h2><section id="yuanyin"><h3>元音（陰、陽入韻）</h3><p>aeioua̍e̍i̍o̍u̍</p></section></section><section id="pua"><h2>萌典PUA</h2><p class="noti">以下是用於「<a href="//moedict.tw">萌典</a>」的PUA陽入韻字元，使用web字體「Romanization Sans」，可保證在<em>所有</em>瀏覽器下正常顯示。<!--
-->搭配「<a href="./subst.html">字元的替換</a>」功能可提供對無障礙瀏覽器較友好、更加語意化的網頁。</p><p>󳆴󳆵󳆶󳆷（<code>\uF31B4-7</code>）<br>󰁡󰁥󰁩󰁯󰁵（<code>\uF006x、\uF0075</code>）</p></section></article><script src="./han.min.js"></script></body></html>