mirror of
https://github.com/servo/servo.git
synced 2025-06-23 08:34:42 +01:00
359 lines
No EOL
18 KiB
HTML
359 lines
No EOL
18 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||
<title>CSS Test: text-transform - fullwidth - basic cases</title>
|
||
<style type="text/css">
|
||
@page { font: italic 8pt sans-serif; color: gray;
|
||
margin: 7%;
|
||
counter-increment: page;
|
||
@top-left { content: "CSS Text Module Level 3 CR Test Suite"; }
|
||
@top-right { content: "Test text-transform-fullwidth-001"; }
|
||
@bottom-right { content: counter(page); }
|
||
}
|
||
</style>
|
||
<link rel="author" title="Satoshi Umehara" href="mailto:umehara@est.co.jp" />
|
||
<link rel="reviewer" title="Koji Ishii" href="mailto:kojiishi@gluesoft.co.jp" />
|
||
<link rel="help" title="CSS Text Level 3: 3.1. Transforming Text: the ‘text-transform’ property" href="http://www.w3.org/TR/css-text-3/#text-transform" />
|
||
<link rel="match" href="reference/text-transform-fullwidth-001-ref.xht" />
|
||
<meta name="flags" content="" />
|
||
<meta name="assert" content="The UA should transform halfwidth character to fullwidth character when text-transform is set to fullwidth." />
|
||
<style type="text/css">
|
||
<![CDATA[
|
||
.test span {
|
||
text-transform: full-width;
|
||
}
|
||
/* the CSS below is not part of the test */
|
||
span {
|
||
background-color: cyan;
|
||
}
|
||
.test {
|
||
color: Blue;
|
||
font-size: 200%;
|
||
line-height: 1.2em;
|
||
}
|
||
.test div {
|
||
display: inline-block;
|
||
margin-bottom: 1em;
|
||
margin-top: 1em;
|
||
text-align: center;
|
||
white-space: nowrap;
|
||
width: 5em;
|
||
}
|
||
]]>
|
||
</style>
|
||
<script type="text/javascript">
|
||
// <![CDATA[
|
||
// Set Font Family to 'IPAMincho'
|
||
function setFontFamily () {
|
||
var fontName = 'IPAMincho';
|
||
var divs = document.getElementsByTagName('div');
|
||
var i = 0;
|
||
var div;
|
||
while (i < divs.length) {
|
||
div = divs.item(i);
|
||
if (div.className == 'test') {
|
||
div.style.fontFamily = fontName;
|
||
}
|
||
i++;
|
||
}
|
||
}
|
||
// ]]>
|
||
</script>
|
||
</head>
|
||
<body>
|
||
<p>
|
||
Test passes if the upper character in each pair matches the lower one in both shape <strong>and size</strong>.
|
||
</p>
|
||
<div class="test">
|
||
|
||
<!-- FULLWIDTH LATIN -->
|
||
<div>[<span> </span>]<br />[<span> </span>]</div>
|
||
<div><span>！</span><br /><span>!</span></div>
|
||
<div><span>”</span><br /><span>"</span></div>
|
||
<div><span>＃</span><br /><span>#</span></div>
|
||
<div><span>＄</span><br /><span>$</span></div>
|
||
<div><span>％</span><br /><span>%</span></div>
|
||
<div><span>＆</span><br /><span>&</span></div>
|
||
<div><span>’</span><br /><span>'</span></div>
|
||
<div><span>（</span><br /><span>(</span></div>
|
||
<div><span>）</span><br /><span>)</span></div>
|
||
<div><span>＊</span><br /><span>*</span></div>
|
||
<div><span>＋</span><br /><span>+</span></div>
|
||
<div><span>，</span><br /><span>,</span></div>
|
||
<div><span>－</span><br /><span>-</span></div>
|
||
<div><span>．</span><br /><span>.</span></div>
|
||
<div><span>／</span><br /><span>/</span></div>
|
||
<br />
|
||
<div><span>０</span><br /><span>0</span></div>
|
||
<div><span>１</span><br /><span>1</span></div>
|
||
<div><span>２</span><br /><span>2</span></div>
|
||
<div><span>３</span><br /><span>3</span></div>
|
||
<div><span>４</span><br /><span>4</span></div>
|
||
<div><span>５</span><br /><span>5</span></div>
|
||
<div><span>６</span><br /><span>6</span></div>
|
||
<div><span>７</span><br /><span>7</span></div>
|
||
<div><span>８</span><br /><span>8</span></div>
|
||
<div><span>９</span><br /><span>9</span></div>
|
||
<br />
|
||
<div><span>：</span><br /><span>:</span></div>
|
||
<div><span>；</span><br /><span>;</span></div>
|
||
<div><span>＜</span><br /><span><</span></div>
|
||
<div><span>＝</span><br /><span>=</span></div>
|
||
<div><span>＞</span><br /><span>></span></div>
|
||
<div><span>？</span><br /><span>?</span></div>
|
||
<div><span>＠</span><br /><span>@</span></div>
|
||
<br />
|
||
<div><span>Ａ</span><br /><span>A</span></div>
|
||
<div><span>Ｂ</span><br /><span>B</span></div>
|
||
<div><span>Ｃ</span><br /><span>C</span></div>
|
||
<div><span>Ｄ</span><br /><span>D</span></div>
|
||
<div><span>Ｅ</span><br /><span>E</span></div>
|
||
<div><span>Ｆ</span><br /><span>F</span></div>
|
||
<div><span>Ｇ</span><br /><span>G</span></div>
|
||
<div><span>Ｈ</span><br /><span>H</span></div>
|
||
<div><span>Ｉ</span><br /><span>I</span></div>
|
||
<div><span>Ｊ</span><br /><span>J</span></div>
|
||
<div><span>Ｋ</span><br /><span>K</span></div>
|
||
<div><span>Ｌ</span><br /><span>L</span></div>
|
||
<div><span>Ｍ</span><br /><span>M</span></div>
|
||
<div><span>Ｎ</span><br /><span>N</span></div>
|
||
<div><span>Ｏ</span><br /><span>O</span></div>
|
||
<div><span>Ｐ</span><br /><span>P</span></div>
|
||
<div><span>Ｑ</span><br /><span>Q</span></div>
|
||
<div><span>Ｒ</span><br /><span>R</span></div>
|
||
<div><span>Ｓ</span><br /><span>S</span></div>
|
||
<div><span>Ｔ</span><br /><span>T</span></div>
|
||
<div><span>Ｕ</span><br /><span>U</span></div>
|
||
<div><span>Ｖ</span><br /><span>V</span></div>
|
||
<div><span>Ｗ</span><br /><span>W</span></div>
|
||
<div><span>Ｘ</span><br /><span>X</span></div>
|
||
<div><span>Ｙ</span><br /><span>Y</span></div>
|
||
<div><span>Ｚ</span><br /><span>Z</span></div>
|
||
<br />
|
||
<div><span>［</span><br /><span>[</span></div>
|
||
<div><span>＼</span><br /><span>\</span></div>
|
||
<div><span>］</span><br /><span>]</span></div>
|
||
<div><span>＾</span><br /><span>^</span></div>
|
||
<div><span>＿</span><br /><span>_</span></div>
|
||
<div><span>｀</span><br /><span>`</span></div>
|
||
<br />
|
||
<div><span>ａ</span><br /><span>a</span></div>
|
||
<div><span>ｂ</span><br /><span>b</span></div>
|
||
<div><span>ｃ</span><br /><span>c</span></div>
|
||
<div><span>ｄ</span><br /><span>d</span></div>
|
||
<div><span>ｅ</span><br /><span>e</span></div>
|
||
<div><span>ｆ</span><br /><span>f</span></div>
|
||
<div><span>ｇ</span><br /><span>g</span></div>
|
||
<div><span>ｈ</span><br /><span>h</span></div>
|
||
<div><span>ｉ</span><br /><span>i</span></div>
|
||
<div><span>ｊ</span><br /><span>j</span></div>
|
||
<div><span>ｋ</span><br /><span>k</span></div>
|
||
<div><span>ｌ</span><br /><span>l</span></div>
|
||
<div><span>ｍ</span><br /><span>m</span></div>
|
||
<div><span>ｎ</span><br /><span>n</span></div>
|
||
<div><span>ｏ</span><br /><span>o</span></div>
|
||
<div><span>ｐ</span><br /><span>p</span></div>
|
||
<div><span>ｑ</span><br /><span>q</span></div>
|
||
<div><span>ｒ</span><br /><span>r</span></div>
|
||
<div><span>ｓ</span><br /><span>s</span></div>
|
||
<div><span>ｔ</span><br /><span>t</span></div>
|
||
<div><span>ｕ</span><br /><span>u</span></div>
|
||
<div><span>ｖ</span><br /><span>v</span></div>
|
||
<div><span>ｗ</span><br /><span>w</span></div>
|
||
<div><span>ｘ</span><br /><span>x</span></div>
|
||
<div><span>ｙ</span><br /><span>y</span></div>
|
||
<div><span>ｚ</span><br /><span>z</span></div>
|
||
<br />
|
||
<div><span>｛</span><br /><span>{</span></div>
|
||
<div><span>｜</span><br /><span>|</span></div>
|
||
<div><span>｝</span><br /><span>}</span></div>
|
||
<div><span>～</span><br /><span>~</span></div>
|
||
|
||
<div><span>｟</span><br /><span>⦅</span></div> <!-- LEFT WHITE PARENTHESIS -->
|
||
<div><span>｠</span><br /><span>⦆</span></div> <!-- RIGHT WHITE PARENTHESIS -->
|
||
|
||
<!-- HALFWIDTH KATAKANA -->
|
||
<br />
|
||
<div><span>。</span><br /><span>｡</span></div>
|
||
<div><span>「</span><br /><span>｢</span></div>
|
||
<div><span>」</span><br /><span>｣</span></div>
|
||
<div><span>、</span><br /><span>､</span></div>
|
||
<div><span>・</span><br /><span>･</span></div>
|
||
<br />
|
||
<div><span>ヲ</span><br /><span>ｦ</span></div>
|
||
<div><span>ァ</span><br /><span>ｧ</span></div>
|
||
<div><span>ィ</span><br /><span>ｨ</span></div>
|
||
<div><span>ゥ</span><br /><span>ｩ</span></div>
|
||
<div><span>ェ</span><br /><span>ｪ</span></div>
|
||
<div><span>ォ</span><br /><span>ｫ</span></div>
|
||
<div><span>ャ</span><br /><span>ｬ</span></div>
|
||
<div><span>ュ</span><br /><span>ｭ</span></div>
|
||
<div><span>ョ</span><br /><span>ｮ</span></div>
|
||
<div><span>ッ</span><br /><span>ｯ</span></div>
|
||
<div><span>ー</span><br /><span>ｰ</span></div>
|
||
<br />
|
||
<div><span>ア</span><br /><span>ｱ</span></div>
|
||
<div><span>イ</span><br /><span>ｲ</span></div>
|
||
<div><span>ウ</span><br /><span>ｳ</span></div>
|
||
<div><span>エ</span><br /><span>ｴ</span></div>
|
||
<div><span>オ</span><br /><span>ｵ</span></div>
|
||
<div><span>カ</span><br /><span>ｶ</span></div>
|
||
<div><span>キ</span><br /><span>ｷ</span></div>
|
||
<div><span>ク</span><br /><span>ｸ</span></div>
|
||
<div><span>ケ</span><br /><span>ｹ</span></div>
|
||
<div><span>コ</span><br /><span>ｺ</span></div>
|
||
<div><span>サ</span><br /><span>ｻ</span></div>
|
||
<div><span>シ</span><br /><span>ｼ</span></div>
|
||
<div><span>ス</span><br /><span>ｽ</span></div>
|
||
<div><span>セ</span><br /><span>ｾ</span></div>
|
||
<div><span>ソ</span><br /><span>ｿ</span></div>
|
||
<div><span>タ</span><br /><span>ﾀ</span></div>
|
||
<div><span>チ</span><br /><span>ﾁ</span></div>
|
||
<div><span>ツ</span><br /><span>ﾂ</span></div>
|
||
<div><span>テ</span><br /><span>ﾃ</span></div>
|
||
<div><span>ト</span><br /><span>ﾄ</span></div>
|
||
<div><span>ナ</span><br /><span>ﾅ</span></div>
|
||
<div><span>ニ</span><br /><span>ﾆ</span></div>
|
||
<div><span>ヌ</span><br /><span>ﾇ</span></div>
|
||
<div><span>ネ</span><br /><span>ﾈ</span></div>
|
||
<div><span>ノ</span><br /><span>ﾉ</span></div>
|
||
<div><span>ハ</span><br /><span>ﾊ</span></div>
|
||
<div><span>ヒ</span><br /><span>ﾋ</span></div>
|
||
<div><span>フ</span><br /><span>ﾌ</span></div>
|
||
<div><span>ヘ</span><br /><span>ﾍ</span></div>
|
||
<div><span>ホ</span><br /><span>ﾎ</span></div>
|
||
<div><span>マ</span><br /><span>ﾏ</span></div>
|
||
<div><span>ミ</span><br /><span>ﾐ</span></div>
|
||
<div><span>ム</span><br /><span>ﾑ</span></div>
|
||
<div><span>メ</span><br /><span>ﾒ</span></div>
|
||
<div><span>モ</span><br /><span>ﾓ</span></div>
|
||
<div><span>ヤ</span><br /><span>ﾔ</span></div>
|
||
<div><span>ユ</span><br /><span>ﾕ</span></div>
|
||
<div><span>ヨ</span><br /><span>ﾖ</span></div>
|
||
<div><span>ラ</span><br /><span>ﾗ</span></div>
|
||
<div><span>リ</span><br /><span>ﾘ</span></div>
|
||
<div><span>ル</span><br /><span>ﾙ</span></div>
|
||
<div><span>レ</span><br /><span>ﾚ</span></div>
|
||
<div><span>ロ</span><br /><span>ﾛ</span></div>
|
||
<div><span>ワ</span><br /><span>ﾜ</span></div>
|
||
<div><span>ン</span><br /><span>ﾝ</span></div>
|
||
<br />
|
||
<div><span>゛</span><br /><span>ﾞ</span></div>
|
||
<div><span>゜</span><br /><span>ﾟ</span></div>
|
||
|
||
<!-- HALFWIDTH HANGUL -->
|
||
<br />
|
||
<div>[<span>ᅟ</span>]<br />[<span>ﾠ</span>]</div> <!-- HANGUL FILLER -->
|
||
<div><span>ᆨ</span><br /><span>ﾡ</span></div> <!-- HANGUL LETTER KIYEOK -->
|
||
<div><span>ᆩ</span><br /><span>ﾢ</span></div> <!-- HANGUL LETTER SSANGKIYEOK -->
|
||
<div><span>ᆪ</span><br /><span>ﾣ</span></div> <!-- HANGUL LETTER KIYEOK-SIOS -->
|
||
<div><span>ᆫ</span><br /><span>ﾤ</span></div> <!-- HANGUL LETTER NIEUN -->
|
||
<div><span>ᆬ</span><br /><span>ﾥ</span></div> <!-- HANGUL LETTER NIEUN-CIEUC -->
|
||
<div><span>ᆭ</span><br /><span>ﾦ</span></div> <!-- HANGUL LETTER NIEUN-HIEUH -->
|
||
<div><span>ᆮ</span><br /><span>ﾧ</span></div> <!-- HANGUL LETTER TIKEUT -->
|
||
<div><span>ᄄ</span><br /><span>ﾨ</span></div> <!-- HANGUL LETTER SSANGTIKEUT -->
|
||
<div><span>ᆯ</span><br /><span>ﾩ</span></div> <!-- HANGUL LETTER RIEUL -->
|
||
<div><span>ᆰ</span><br /><span>ﾪ</span></div> <!-- HANGUL LETTER RIEUL-KIYEOK -->
|
||
<div><span>ᆱ</span><br /><span>ﾫ</span></div> <!-- HANGUL LETTER RIEUL-MIEUM -->
|
||
<div><span>ᆲ</span><br /><span>ﾬ</span></div> <!-- HANGUL LETTER RIEUL-PIEUP -->
|
||
<div><span>ᆳ</span><br /><span>ﾭ</span></div> <!-- HANGUL LETTER RIEUL-SIOS -->
|
||
<div><span>ᆴ</span><br /><span>ﾮ</span></div> <!-- HANGUL LETTER RIEUL-THIEUTH -->
|
||
<div><span>ᆵ</span><br /><span>ﾯ</span></div> <!-- HANGUL LETTER RIEUL-PHIEUPH -->
|
||
<div><span>ᄚ</span><br /><span>ﾰ</span></div> <!-- HANGUL LETTER RIEUL-HIEUH -->
|
||
<div><span>ᄆ</span><br /><span>ﾱ</span></div> <!-- HANGUL LETTER MIEUM -->
|
||
<div><span>ᄇ</span><br /><span>ﾲ</span></div> <!-- HANGUL LETTER PIEUP -->
|
||
<div><span>ᄈ</span><br /><span>ﾳ</span></div> <!-- HANGUL LETTER SSANGPIEUP -->
|
||
<div><span>ᆹ</span><br /><span>ﾴ</span></div> <!-- HANGUL LETTER PIEUP-SIOS -->
|
||
<div><span>ᄉ</span><br /><span>ﾵ</span></div> <!-- HANGUL LETTER SIOS -->
|
||
<div><span>ᆻ</span><br /><span>ﾶ</span></div> <!-- HANGUL LETTER SSANGSIOS -->
|
||
<div><span>ᄋ</span><br /><span>ﾷ</span></div> <!-- HANGUL LETTER IEUNG -->
|
||
<div><span>ᆽ</span><br /><span>ﾸ</span></div> <!-- HANGUL LETTER CIEUC -->
|
||
<div><span>ᄍ</span><br /><span>ﾹ</span></div> <!-- HANGUL LETTER SSANGCIEUC -->
|
||
<div><span>ᆾ</span><br /><span>ﾺ</span></div> <!-- HANGUL LETTER CHIEUCH -->
|
||
<div><span>ᄏ</span><br /><span>ﾻ</span></div> <!-- HANGUL LETTER KHIEUKH -->
|
||
<div><span>ᇀ</span><br /><span>ﾼ</span></div> <!-- HANGUL LETTER THIEUTH -->
|
||
<div><span>ᄑ</span><br /><span>ﾽ</span></div> <!-- HANGUL LETTER PHIEUPH -->
|
||
<div><span>ᇂ</span><br /><span>ﾾ</span></div> <!-- HANGUL LETTER HIEUH -->
|
||
<br />
|
||
<div><span>ᅡ</span><br /><span>ￂ</span></div> <!-- HANGUL LETTER A -->
|
||
<div><span>ᅢ</span><br /><span>ￃ</span></div> <!-- HANGUL LETTER AE -->
|
||
<div><span>ᅣ</span><br /><span>ￄ</span></div> <!-- HANGUL LETTER YA -->
|
||
<div><span>ᅤ</span><br /><span>ￅ</span></div> <!-- HANGUL LETTER YAE -->
|
||
<div><span>ᅥ</span><br /><span>ￆ</span></div> <!-- HANGUL LETTER EO -->
|
||
<div><span>ᅦ</span><br /><span>ￇ</span></div> <!-- HANGUL LETTER E -->
|
||
|
||
<div><span>ᅧ</span><br /><span>ￊ</span></div> <!-- HANGUL LETTER YEO -->
|
||
<div><span>ᅨ</span><br /><span>ￋ</span></div> <!-- HANGUL LETTER YE -->
|
||
<div><span>ᅩ</span><br /><span>ￌ</span></div> <!-- HANGUL LETTER O -->
|
||
<div><span>ᅪ</span><br /><span>ￍ</span></div> <!-- HANGUL LETTER WA -->
|
||
<div><span>ᅫ</span><br /><span>ￎ</span></div> <!-- HANGUL LETTER WAE -->
|
||
<div><span>ᅬ</span><br /><span>ￏ</span></div> <!-- HANGUL LETTER OE -->
|
||
|
||
<div><span>ᅭ</span><br /><span>ￒ</span></div> <!-- HANGUL LETTER YO -->
|
||
<div><span>ᅮ</span><br /><span>ￓ</span></div> <!-- HANGUL LETTER U -->
|
||
<div><span>ᅯ</span><br /><span>ￔ</span></div> <!-- HANGUL LETTER WEO -->
|
||
<div><span>ᅰ</span><br /><span>ￕ</span></div> <!-- HANGUL LETTER WE -->
|
||
<div><span>ᅱ</span><br /><span>ￖ</span></div> <!-- HANGUL LETTER WI -->
|
||
<div><span>ᅲ</span><br /><span>ￗ</span></div> <!-- HANGUL LETTER YU -->
|
||
|
||
<div><span>ᅳ</span><br /><span>ￚ</span></div> <!-- HANGUL LETTER EU -->
|
||
<div><span>ᅴ</span><br /><span>ￛ</span></div> <!-- HANGUL LETTER YI -->
|
||
<div><span>ᅵ</span><br /><span>ￜ</span></div> <!-- HANGUL LETTER I -->
|
||
|
||
<!-- FULLWIDTH SIGN -->
|
||
<br />
|
||
<div><span>￠</span><br /><span>¢</span></div> <!-- CENT SIGN -->
|
||
<div><span>￡</span><br /><span>£</span></div> <!-- POUND SIGN -->
|
||
<div><span>￢</span><br /><span>¬</span></div> <!-- NOT SIGN -->
|
||
<div><span>￣</span><br /><span>¯</span></div> <!-- MACRON -->
|
||
<div><span>￤</span><br /><span>¦</span></div> <!-- BROKEN BAR -->
|
||
<div><span>￥</span><br /><span>¥</span></div> <!-- YEN SIGN -->
|
||
<div><span>￦</span><br /><span>₩</span></div> <!-- WON SIGN -->
|
||
|
||
<!-- HALFWIDTH SIGN -->
|
||
<br />
|
||
<div><span>｜</span><br /><span>￨</span></div> <!-- FORMS LIGHT VERTICAL -->
|
||
<div><span>←</span><br /><span>￩</span></div> <!-- LEFTWARDS ARROW -->
|
||
<div><span>↑</span><br /><span>￪</span></div> <!-- UPWARDS ARROW -->
|
||
<div><span>→</span><br /><span>￫</span></div> <!-- RIGHTWARDS ARROW -->
|
||
<div><span>↓</span><br /><span>￬</span></div> <!-- DOWNWARDS ARROW -->
|
||
<div><span>■</span><br /><span>￭</span></div> <!-- BLACK SQUARE -->
|
||
<div><span>○</span><br /><span>￮</span></div> <!-- WHITE CIRCLE -->
|
||
|
||
<!-- HALFWIDTH LATIN -->
|
||
<br />
|
||
<div><span>Ａ</span><br /><span>Ａ</span></div>
|
||
<div><span>Ｂ</span><br /><span>Ｂ</span></div>
|
||
<div><span>Ｃ</span><br /><span>Ｃ</span></div>
|
||
<br />
|
||
<div><span>ａ</span><br /><span>ａ</span></div>
|
||
<div><span>ｂ</span><br /><span>ｂ</span></div>
|
||
<div><span>ｃ</span><br /><span>ｃ</span></div>
|
||
|
||
<!-- FULLWIDTH KANA -->
|
||
<br />
|
||
<div><span>あ</span><br /><span>あ</span></div>
|
||
<div><span>い</span><br /><span>い</span></div>
|
||
<div><span>う</span><br /><span>う</span></div>
|
||
<div><span>え</span><br /><span>え</span></div>
|
||
<div><span>お</span><br /><span>お</span></div>
|
||
<br />
|
||
<div><span>ア</span><br /><span>ア</span></div>
|
||
<div><span>イ</span><br /><span>イ</span></div>
|
||
<div><span>ウ</span><br /><span>ウ</span></div>
|
||
<div><span>エ</span><br /><span>エ</span></div>
|
||
<div><span>オ</span><br /><span>オ</span></div>
|
||
</div>
|
||
<p id="fontChange" style="display: none;">
|
||
If you are unable to see font glyphs for certain characters using the browsers default font, install the <a href="http://ossipedia.ipa.go.jp/ipafont/">IPA Font(http://ossipedia.ipa.go.jp/ipafont/)</a> and apply it.
|
||
<button type="button" onclick="setFontFamily()">
|
||
Apply
|
||
</button>
|
||
</p>
|
||
<script type="text/javascript">
|
||
if (document.getElementById) {
|
||
document.getElementById('fontChange').style.display = 'block'
|
||
}
|
||
</script>
|
||
</body>
|
||
</html> |