mirror of
https://github.com/servo/servo.git
synced 2025-06-23 16:44:33 +01:00
150 lines
9.5 KiB
HTML
150 lines
9.5 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<title>CSS Writing Modes Test: Test orientation of characters where vo=U (#1/6, 2048 code points in U+00A7-2ED3).</title>
|
|
<link rel="help" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation">
|
|
<meta name="assert" content="Test orientation of characters where vo=U (#1/6, 2048 code points in U+00A7-2ED3)">
|
|
<meta name="flags" content="dom font">
|
|
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<style>
|
|
@font-face {
|
|
font-family: "orientation";
|
|
src: url("support/adobe-fonts/CSSHWOrientationTest.otf");
|
|
}
|
|
.test {
|
|
font: 16px/1 "orientation";
|
|
height: 17em;
|
|
writing-mode: vertical-rl;
|
|
}
|
|
.line {
|
|
white-space: pre;
|
|
}
|
|
.U {
|
|
text-orientation: upright;
|
|
}
|
|
.R {
|
|
text-orientation: sideways;
|
|
}
|
|
#details {
|
|
margin: 1em .5em;
|
|
}
|
|
summary {
|
|
font-size: 1.2em;
|
|
font-weight: bold;
|
|
margin-top: .5em;
|
|
}
|
|
</style>
|
|
<div id="log"></div>
|
|
<div id="details"></div>
|
|
<div id="container">
|
|
<div data-vo="U" class="test">
|
|
<div data-block="Latin">
|
|
<div class="line">§©®±¼½¾×÷</div>
|
|
</div>
|
|
<div data-block="Spacing">
|
|
<div class="line">˪˫</div>
|
|
</div>
|
|
<div data-block="Hangul">
|
|
<div class="line">ᄀᄁᄂᄃᄄᄅᄆᄇᄈᄉᄊᄋᄌᄍᄎᄏᄐᄑᄒᄓᄔᄕᄖᄗᄘᄙᄚᄛᄜᄝᄞᄟ</div>
|
|
<div class="line">ᄠᄡᄢᄣᄤᄥᄦᄧᄨᄩᄪᄫᄬᄭᄮᄯᄰᄱᄲᄳᄴᄵᄶᄷᄸᄹᄺᄻᄼᄽᄾᄿ</div>
|
|
<div class="line">ᅀᅁᅂᅃᅄᅅᅆᅇᅈᅉᅊᅋᅌᅍᅎᅏᅐᅑᅒᅓᅔᅕᅖᅗᅘᅙᅚᅛᅜᅝᅞᅟ</div>
|
|
<div class="line">ᅠᅡᅢᅣᅤᅥᅦᅧᅨᅩᅪᅫᅬᅭᅮᅯᅰᅱᅲᅳᅴᅵᅶᅷᅸᅹᅺᅻᅼᅽᅾᅿ</div>
|
|
<div class="line">ᆀᆁᆂᆃᆄᆅᆆᆇᆈᆉᆊᆋᆌᆍᆎᆏᆐᆑᆒᆓᆔᆕᆖᆗᆘᆙᆚᆛᆜᆝᆞᆟ</div>
|
|
<div class="line">ᆠᆡᆢᆣᆤᆥᆦᆧᆨᆩᆪᆫᆬᆭᆮᆯᆰᆱᆲᆳᆴᆵᆶᆷᆸᆹᆺᆻᆼᆽᆾᆿ</div>
|
|
<div class="line">ᇀᇁᇂᇃᇄᇅᇆᇇᇈᇉᇊᇋᇌᇍᇎᇏᇐᇑᇒᇓᇔᇕᇖᇗᇘᇙᇚᇛᇜᇝᇞᇟ</div>
|
|
<div class="line">ᇠᇡᇢᇣᇤᇥᇦᇧᇨᇩᇪᇫᇬᇭᇮᇯᇰᇱᇲᇳᇴᇵᇶᇷᇸᇹᇺᇻᇼᇽᇾᇿ</div>
|
|
</div>
|
|
<div data-block="Unified">
|
|
<div class="line">ᐁᐂᐃᐄᐅᐆᐇᐈᐉᐊᐋᐌᐍᐎᐏᐐᐑᐒᐓᐔᐕᐖᐗᐘᐙᐚᐛᐜᐝᐞᐟᐠ</div>
|
|
<div class="line">ᐡᐢᐣᐤᐥᐦᐧᐨᐩᐪᐫᐬᐭᐮᐯᐰᐱᐲᐳᐴᐵᐶᐷᐸᐹᐺᐻᐼᐽᐾᐿᑀ</div>
|
|
<div class="line">ᑁᑂᑃᑄᑅᑆᑇᑈᑉᑊᑋᑌᑍᑎᑏᑐᑑᑒᑓᑔᑕᑖᑗᑘᑙᑚᑛᑜᑝᑞᑟᑠ</div>
|
|
<div class="line">ᑡᑢᑣᑤᑥᑦᑧᑨᑩᑪᑫᑬᑭᑮᑯᑰᑱᑲᑳᑴᑵᑶᑷᑸᑹᑺᑻᑼᑽᑾᑿᒀ</div>
|
|
<div class="line">ᒁᒂᒃᒄᒅᒆᒇᒈᒉᒊᒋᒌᒍᒎᒏᒐᒑᒒᒓᒔᒕᒖᒗᒘᒙᒚᒛᒜᒝᒞᒟᒠ</div>
|
|
<div class="line">ᒡᒢᒣᒤᒥᒦᒧᒨᒩᒪᒫᒬᒭᒮᒯᒰᒱᒲᒳᒴᒵᒶᒷᒸᒹᒺᒻᒼᒽᒾᒿᓀ</div>
|
|
<div class="line">ᓁᓂᓃᓄᓅᓆᓇᓈᓉᓊᓋᓌᓍᓎᓏᓐᓑᓒᓓᓔᓕᓖᓗᓘᓙᓚᓛᓜᓝᓞᓟᓠ</div>
|
|
<div class="line">ᓡᓢᓣᓤᓥᓦᓧᓨᓩᓪᓫᓬᓭᓮᓯᓰᓱᓲᓳᓴᓵᓶᓷᓸᓹᓺᓻᓼᓽᓾᓿᔀ</div>
|
|
<div class="line">ᔁᔂᔃᔄᔅᔆᔇᔈᔉᔊᔋᔌᔍᔎᔏᔐᔑᔒᔓᔔᔕᔖᔗᔘᔙᔚᔛᔜᔝᔞᔟᔠ</div>
|
|
<div class="line">ᔡᔢᔣᔤᔥᔦᔧᔨᔩᔪᔫᔬᔭᔮᔯᔰᔱᔲᔳᔴᔵᔶᔷᔸᔹᔺᔻᔼᔽᔾᔿᕀ</div>
|
|
<div class="line">ᕁᕂᕃᕄᕅᕆᕇᕈᕉᕊᕋᕌᕍᕎᕏᕐᕑᕒᕓᕔᕕᕖᕗᕘᕙᕚᕛᕜᕝᕞᕟᕠ</div>
|
|
<div class="line">ᕡᕢᕣᕤᕥᕦᕧᕨᕩᕪᕫᕬᕭᕮᕯᕰᕱᕲᕳᕴᕵᕶᕷᕸᕹᕺᕻᕼᕽᕾᕿᖀ</div>
|
|
<div class="line">ᖁᖂᖃᖄᖅᖆᖇᖈᖉᖊᖋᖌᖍᖎᖏᖐᖑᖒᖓᖔᖕᖖᖗᖘᖙᖚᖛᖜᖝᖞᖟᖠ</div>
|
|
<div class="line">ᖡᖢᖣᖤᖥᖦᖧᖨᖩᖪᖫᖬᖭᖮᖯᖰᖱᖲᖳᖴᖵᖶᖷᖸᖹᖺᖻᖼᖽᖾᖿᗀ</div>
|
|
<div class="line">ᗁᗂᗃᗄᗅᗆᗇᗈᗉᗊᗋᗌᗍᗎᗏᗐᗑᗒᗓᗔᗕᗖᗗᗘᗙᗚᗛᗜᗝᗞᗟᗠ</div>
|
|
<div class="line">ᗡᗢᗣᗤᗥᗦᗧᗨᗩᗪᗫᗬᗭᗮᗯᗰᗱᗲᗳᗴᗵᗶᗷᗸᗹᗺᗻᗼᗽᗾᗿᘀ</div>
|
|
<div class="line">ᘁᘂᘃᘄᘅᘆᘇᘈᘉᘊᘋᘌᘍᘎᘏᘐᘑᘒᘓᘔᘕᘖᘗᘘᘙᘚᘛᘜᘝᘞᘟᘠ</div>
|
|
<div class="line">ᘡᘢᘣᘤᘥᘦᘧᘨᘩᘪᘫᘬᘭᘮᘯᘰᘱᘲᘳᘴᘵᘶᘷᘸᘹᘺᘻᘼᘽᘾᘿᙀ</div>
|
|
<div class="line">ᙁᙂᙃᙄᙅᙆᙇᙈᙉᙊᙋᙌᙍᙎᙏᙐᙑᙒᙓᙔᙕᙖᙗᙘᙙᙚᙛᙜᙝᙞᙟᙠ</div>
|
|
<div class="line">ᙡᙢᙣᙤᙥᙦᙧᙨᙩᙪᙫᙬ᙭᙮ᙯᙰᙱᙲᙳᙴᙵᙶᙷᙸᙹᙺᙻᙼᙽᙾᙿᢰ</div>
|
|
<div class="line">ᢱᢲᢳᢴᢵᢶᢷᢸᢹᢺᢻᢼᢽᢾᢿᣀᣁᣂᣃᣄᣅᣆᣇᣈᣉᣊᣋᣌᣍᣎᣏᣐ</div>
|
|
<div class="line">ᣑᣒᣓᣔᣕᣖᣗᣘᣙᣚᣛᣜᣝᣞᣟᣠᣡᣢᣣᣤᣥᣦᣧᣨᣩᣪᣫᣬᣭᣮᣯᣰ</div>
|
|
<div class="line">ᣱᣲᣳᣴᣵ</div>
|
|
</div>
|
|
<div data-block="General">
|
|
<div class="line">‖†‡‰‱※‼⁂⁇⁈⁉⁑</div>
|
|
</div>
|
|
<div data-block="Letterlike">
|
|
<div class="line">℀℁℃℄℅℆ℇ℈℉ℏℓ℔№℗℞℟℠℡™℣℥℧℩℮ℵℶℷℸℹ℺℻ℼ</div>
|
|
<div class="line">ℽℾℿⅅⅆⅇⅈⅉ⅊⅌⅍⅏</div>
|
|
</div>
|
|
<div data-block="Number">
|
|
<div class="line">⅐⅑⅒⅓⅔⅕⅖⅗⅘⅙⅚⅛⅜⅝⅞⅟ⅠⅡⅢⅣⅤⅥⅦⅧⅨⅩⅪⅫⅬⅭⅮⅯ</div>
|
|
<div class="line">ⅰⅱⅲⅳⅴⅵⅶⅷⅸⅹⅺⅻⅼⅽⅾⅿↀↁↂↃↄↅↆↇↈ↉</div>
|
|
</div>
|
|
<div data-block="Mathematical">
|
|
<div class="line">∞∴∵</div>
|
|
</div>
|
|
<div data-block="Miscellaneous">
|
|
<div class="line">⌀⌁⌂⌃⌄⌅⌆⌇⌌⌍⌎⌏⌐⌑⌒⌓⌔⌕⌖⌗⌘⌙⌚⌛⌜⌝⌞⌟⌤⌥⌦⌧</div>
|
|
<div class="line">⌨⌫⍽⍾⍿⎀⎁⎂⎃⎄⎅⎆⎇⎈⎉⎊⎋⎌⎍⎎⎏⎐⎑⎒⎓⎔⎕⎖⎗⎘⎙⎚</div>
|
|
<div class="line">⎾⎿⏀⏁⏂⏃⏄⏅⏆⏇⏈⏉⏊⏋⏌⏍⏏⏑⏒⏓⏔⏕⏖⏗⏘⏙⏚⏛⏢⏣⏤⏥</div>
|
|
<div class="line">⏦⏧⏨⏩⏪⏫⏬⏭⏮⏯⏰⏱⏲⏳⏴⏵⏶⏷⏸⏹⏺⏻⏼⏽⏾</div>
|
|
</div>
|
|
<div data-block="Control">
|
|
<div class="line">␀␁␂␃␄␅␆␇␈␉␊␋␌␍␎␏␐␑␒␓␔␕␖␗␘␙␚␛␜␝␞␟</div>
|
|
<div class="line">␠␡␢␥␦</div>
|
|
</div>
|
|
<div data-block="Optical">
|
|
<div class="line">⑀⑁⑂⑃⑄⑅⑆⑇⑈⑉⑊</div>
|
|
</div>
|
|
<div data-block="Enclosed">
|
|
<div class="line">①②③④⑤⑥⑦⑧⑨⑩⑪⑫⑬⑭⑮⑯⑰⑱⑲⑳⑴⑵⑶⑷⑸⑹⑺⑻⑼⑽⑾⑿</div>
|
|
<div class="line">⒀⒁⒂⒃⒄⒅⒆⒇⒈⒉⒊⒋⒌⒍⒎⒏⒐⒑⒒⒓⒔⒕⒖⒗⒘⒙⒚⒛⒜⒝⒞⒟</div>
|
|
<div class="line">⒠⒡⒢⒣⒤⒥⒦⒧⒨⒩⒪⒫⒬⒭⒮⒯⒰⒱⒲⒳⒴⒵ⒶⒷⒸⒹⒺⒻⒼⒽⒾⒿ</div>
|
|
<div class="line">ⓀⓁⓂⓃⓄⓅⓆⓇⓈⓉⓊⓋⓌⓍⓎⓏⓐⓑⓒⓓⓔⓕⓖⓗⓘⓙⓚⓛⓜⓝⓞⓟ</div>
|
|
<div class="line">ⓠⓡⓢⓣⓤⓥⓦⓧⓨⓩ⓪⓫⓬⓭⓮⓯⓰⓱⓲⓳⓴⓵⓶⓷⓸⓹⓺⓻⓼⓽⓾⓿</div>
|
|
</div>
|
|
<div data-block="Geometric">
|
|
<div class="line">■□▢▣▤▥▦▧▨▩▪▫▬▭▮▯▰▱▲△▴▵▶▷▸▹►▻▼▽▾▿</div>
|
|
<div class="line">◀◁◂◃◄◅◆◇◈◉◊○◌◍◎●◐◑◒◓◔◕◖◗◘◙◚◛◜◝◞◟</div>
|
|
<div class="line">◠◡◢◣◤◥◦◧◨◩◪◫◬◭◮◯◰◱◲◳◴◵◶◷◸◹◺◻◼◽◾◿</div>
|
|
</div>
|
|
<div data-block="Miscellaneous">
|
|
<div class="line">☀☁☂☃☄★☆☇☈☉☊☋☌☍☎☏☐☑☒☓☔☕☖☗☘☙☠☡☢☣☤☥</div>
|
|
<div class="line">☦☧☨☩☪☫☬☭☮☯☰☱☲☳☴☵☶☷☸☹☺☻☼☽☾☿♀♁♂♃♄♅</div>
|
|
<div class="line">♆♇♈♉♊♋♌♍♎♏♐♑♒♓♔♕♖♗♘♙♚♛♜♝♞♟♠♡♢♣♤♥</div>
|
|
<div class="line">♦♧♨♩♪♫♬♭♮♯♰♱♲♳♴♵♶♷♸♹♺♻♼♽♾♿⚀⚁⚂⚃⚄⚅</div>
|
|
<div class="line">⚆⚇⚈⚉⚊⚋⚌⚍⚎⚏⚐⚑⚒⚓⚔⚕⚖⚗⚘⚙⚚⚛⚜⚝⚞⚟⚠⚡⚢⚣⚤⚥</div>
|
|
<div class="line">⚦⚧⚨⚩⚪⚫⚬⚭⚮⚯⚰⚱⚲⚳⚴⚵⚶⚷⚸⚹⚺⚻⚼⚽⚾⚿⛀⛁⛂⛃⛄⛅</div>
|
|
<div class="line">⛆⛇⛈⛉⛊⛋⛌⛍⛎⛏⛐⛑⛒⛓⛔⛕⛖⛗⛘⛙⛚⛛⛜⛝⛞⛟⛠⛡⛢⛣⛤⛥</div>
|
|
<div class="line">⛦⛧⛨⛩⛪⛫⛬⛭⛮⛯⛰⛱⛲⛳⛴⛵⛶⛷⛸⛹⛺⛻⛼⛽⛾⛿</div>
|
|
</div>
|
|
<div data-block="Dingbats">
|
|
<div class="line">✀✁✂✃✄✅✆✇✈✉✊✋✌✍✎✏✐✑✒✓✔✕✖✗✘✙✚✛✜✝✞✟</div>
|
|
<div class="line">✠✡✢✣✤✥✦✧✨✩✪✫✬✭✮✯✰✱✲✳✴✵✶✷✸✹✺✻✼✽✾✿</div>
|
|
<div class="line">❀❁❂❃❄❅❆❇❈❉❊❋❌❍❎❏❐❑❒❓❔❕❖❗❘❙❚❛❜❝❞❟</div>
|
|
<div class="line">❠❡❢❣❤❥❦❧❶❷❸❹❺❻❼❽❾❿➀➁➂➃➄➅➆➇➈➉➊➋➌➍</div>
|
|
<div class="line">➎➏➐➑➒➓</div>
|
|
</div>
|
|
<div data-block="Miscellaneous">
|
|
<div class="line">⬒⬓⬔⬕⬖⬗⬘⬙⬚⬛⬜⬝⬞⬟⬠⬡⬢⬣⬤⬥⬦⬧⬨⬩⬪⬫⬬⬭⬮⬯⭐⭑</div>
|
|
<div class="line">⭒⭓⭔⭕⭖⭗⭘⭙⮸⮹⮽⮾⮿⯀⯁⯂⯃⯄⯅⯆⯇⯈⯊⯋⯌⯍⯎⯏⯐⯑</div>
|
|
</div>
|
|
<div data-block="CJK">
|
|
<div class="line">⺀⺁⺂⺃⺄⺅⺆⺇⺈⺉⺊⺋⺌⺍⺎⺏⺐⺑⺒⺓⺔⺕⺖⺗⺘⺙⺛⺜⺝⺞⺟⺠</div>
|
|
<div class="line">⺡⺢⺣⺤⺥⺦⺧⺨⺩⺪⺫⺬⺭⺮⺯⺰⺱⺲⺳⺴⺵⺶⺷⺸⺹⺺⺻⺼⺽⺾⺿⻀</div>
|
|
<div class="line">⻁⻂⻃⻄⻅⻆⻇⻈⻉⻊⻋⻌⻍⻎⻏⻐⻑⻒⻓</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="support/text-orientation.js"></script>
|