import FIREFOX_52_6_0esr_RELEASE from mozilla-esr52 hg repo

This commit is contained in:
Roy Tam 2018-01-19 03:59:58 +08:00
commit dcd9973243
150858 changed files with 23884658 additions and 0 deletions

View file

@ -0,0 +1,43 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS 2.1: Font matching algorithm (reference)</title>
<link rel="author" title="L. David Baron" href="https://dbaron.org/" />
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
</head>
<body>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</body>
</html>

View file

@ -0,0 +1,61 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS 2.1: Font matching algorithm</title>
<link rel="author" title="L. David Baron" href="https://dbaron.org/" />
<link rel="author" title="Mozilla Corporation" href="http://mozilla.com/" />
<link rel="help" href="http://www.w3.org/TR/CSS21/fonts.html#algorithm" />
<meta name="assert" content="That the 'UA-dependent default 'font-family'' described in step (5) does not vary based on the ancestor's font-family property." />
</head>
<body>
<div style="font-family: Arial, Helvetica, sans-serif">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
<div style="font-family: Arial, Helvetica">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
<div style="font-family: Arial">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
<div style="font-family: Times New Roman, Times, serif">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
<div style="font-family: Times New Roman, Times">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
<div style="font-family: Times New Roman">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
<div style="font-family: Courier New, Courier, monospace">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
<div style="font-family: Verdana">
<div style="font-family: FontDoesNotExist">
Every line of text in this page should be in the same font.
</div>
</div>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Apple Symbols test</title>
<style>
@font-face {
font-family: "Ahem";
src: url(../fonts/Ahem.ttf);
}
body {
font-family: "Ahem", /* Ahem bullet first to establish consistent line metrics */
/* "Apple Symbols", */ /* Apple Symbols for the rest of the chars */
"Menlo", /* fallbacks for when Apple Symbols fails */
"Hiragino Kaku Gothic Pro",
sans-serif;
font-size: 36px;
line-height: 60px;
}
</style>
</head>
<body>
&#x2219;&#x25E6;&#x25ce;&#x2611;&#x261e;
</body>
</html>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Apple Symbols test</title>
<style>
@font-face {
font-family: "Ahem";
src: url(../fonts/Ahem.ttf);
}
body {
font-family: "Ahem", /* Ahem bullet first to establish consistent line metrics */
"Apple Symbols", /* Apple Symbols for the rest of the chars */
"Menlo", /* fallbacks for when Apple Symbols fails */
"Hiragino Kaku Gothic Pro",
sans-serif;
font-size: 36px;
line-height: 60px;
}
</style>
</head>
<body>
&#x2219;&#x25E6;&#x25ce;&#x2611;&#x261e;
</body>
</html>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bug 769475 - test for italicized Arabic script in Arial</title>
<style type="text/css">
body {
font-family: arial, serif;
font-size: 36px;
line-height: 72px;
}
span {
color: white;
}
</style>
</head>
<body lang="ar">
<!-- the white span should have the same width whether it's italicized or not,
-- as Arial does not have Arabic characters in the italic face but we should
-- apply synthetic italic to the regular face, NOT fall back to a different
-- family from prefs.
-->
<div>العربي <span>العربي</span> العربي</div>
</body>
</html>

View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bug 769475 - test for italicized Arabic script in Arial</title>
<style type="text/css">
body {
font-family: arial, serif;
font-size: 36px;
line-height: 72px;
}
span {
font-style: italic;
color: white;
}
</style>
</head>
<body lang="ar">
<!-- the white span should have the same width whether it's italicized or not,
-- as Arial does not have Arabic characters in the italic face but we should
-- apply synthetic italic to the regular face, NOT fall back to a different
-- family from prefs.
-->
<div>العربي <span>العربي</span> العربي</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1 { font-family: Arial, sans-serif; }
p#test2 { font-family: Georgia, serif; }
p#test3 { font-family: Georgia, serif; }
p#test4 { font-family: Georgia, serif; }
p#test1 { color: black; }
p#test2 { color: red; }
p#test3 { color: red; }
p#test4 { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1">{ font-family: Arial, sans-serif; }</p>
<p id="test2">{ font-family: Arial Bold, Georgia, serif; }</p>
<p id="test3">{ font-family: Arial Italic, Georgia, serif; }</p>
<p id="test4">{ font-family: Arial Bold Italic, Georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1 { font-family: Arial, sans-serif; }
p#test2 { font-family: Arial Bold, Georgia, serif; }
p#test3 { font-family: Arial Italic, Georgia, serif; }
p#test4 { font-family: Arial Bold Italic, Georgia, serif; }
p#test1 { color: black; }
p#test2 { color: red; }
p#test3 { color: red; }
p#test4 { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1">{ font-family: Arial, sans-serif; }</p>
<p id="test2">{ font-family: Arial Bold, Georgia, serif; }</p>
<p id="test3">{ font-family: Arial Italic, Georgia, serif; }</p>
<p id="test4">{ font-family: Arial Bold Italic, Georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1a { font-family: Arial, sans-serif; }
p#test2a { font-family: Georgia, serif; }
p#test3a { font-family: Georgia, serif; }
p#test4a { font-family: Georgia, serif; }
p#test1a { color: black; }
p#test2a { color: red; }
p#test3a { color: red; }
p#test4a { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1a">{ font-family: arial, sans-serif; }</p>
<p id="test2a">{ font-family: arial bold, georgia, serif; }</p>
<p id="test3a">{ font-family: arial italic, georgia, serif; }</p>
<p id="test4a">{ font-family: arial bold italic, georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1a { font-family: arial, sans-serif; }
p#test2a { font-family: arial bold, georgia, serif; }
p#test3a { font-family: arial italic, georgia, serif; }
p#test4a { font-family: arial bold italic, georgia, serif; }
p#test1a { color: black; }
p#test2a { color: red; }
p#test3a { color: red; }
p#test4a { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1a">{ font-family: arial, sans-serif; }</p>
<p id="test2a">{ font-family: arial bold, georgia, serif; }</p>
<p id="test3a">{ font-family: arial italic, georgia, serif; }</p>
<p id="test4a">{ font-family: arial bold italic, georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1b { font-family: Georgia, serif; }
p#test2b { font-family: Georgia, serif; }
p#test3b { font-family: Georgia, serif; }
p#test4b { font-family: Georgia, serif; }
p#test1b { color: red; }
p#test2b { color: red; }
p#test3b { color: red; }
p#test4b { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1b">{ font-family: ArialMT, Georgia, serif; }</p>
<p id="test2b">{ font-family: Arial-BoldMT, Georgia, serif; }</p>
<p id="test3b">{ font-family: Arial-ItalicMT, Georgia, serif; }</p>
<p id="test4b">{ font-family: Arial-BoldItalicMT, Georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1b { font-family: ArialMT, Georgia, serif; }
p#test2b { font-family: Arial-BoldMT, Georgia, serif; }
p#test3b { font-family: Arial-ItalicMT, Georgia, serif; }
p#test4b { font-family: Arial-BoldItalicMT, Georgia, serif; }
p#test1b { color: red; }
p#test2b { color: red; }
p#test3b { color: red; }
p#test4b { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1b">{ font-family: ArialMT, Georgia, serif; }</p>
<p id="test2b">{ font-family: Arial-BoldMT, Georgia, serif; }</p>
<p id="test3b">{ font-family: Arial-ItalicMT, Georgia, serif; }</p>
<p id="test4b">{ font-family: Arial-BoldItalicMT, Georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1c { font-family: Georgia, serif; }
p#test2c { font-family: Georgia, serif; }
p#test3c { font-family: Georgia, serif; }
p#test4c { font-family: Georgia, serif; }
p#test1c { color: red; }
p#test2c { color: red; }
p#test3c { color: red; }
p#test4c { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1c">{ font-family: arialmt, georgia, serif; }</p>
<p id="test2c">{ font-family: arial-boldmt, georgia, serif; }</p>
<p id="test3c">{ font-family: arial-italicmt, georgia, serif; }</p>
<p id="test4c">{ font-family: arial-bolditalicmt, georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1c { font-family: arialmt, georgia, serif; }
p#test2c { font-family: arial-boldmt, georgia, serif; }
p#test3c { font-family: arial-italicmt, georgia, serif; }
p#test4c { font-family: arial-bolditalicmt, georgia, serif; }
p#test1c { color: red; }
p#test2c { color: red; }
p#test3c { color: red; }
p#test4c { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1c">{ font-family: arialmt, georgia, serif; }</p>
<p id="test2c">{ font-family: arial-boldmt, georgia, serif; }</p>
<p id="test3c">{ font-family: arial-italicmt, georgia, serif; }</p>
<p id="test4c">{ font-family: arial-bolditalicmt, georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1d { font-family: Arial, sans-serif; }
p#test2d { font-family: Georgia, serif; }
p#test3d { font-family: Georgia, serif; }
p#test4d { font-family: Georgia, serif; }
p#test1d { color: black; }
p#test2d { color: red; }
p#test3d { color: red; }
p#test4d { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1d">{ font-family: "Arial", sans-serif; }</p>
<p id="test2d">{ font-family: "Arial Bold", Georgia, serif; }</p>
<p id="test3d">{ font-family: "Arial Italic", Georgia, serif; }</p>
<p id="test4d">{ font-family: "Arial Bold Italic", Georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1d { font-family: "Arial", sans-serif; }
p#test2d { font-family: "Arial Bold", Georgia, serif; }
p#test3d { font-family: "Arial Italic", Georgia, serif; }
p#test4d { font-family: "Arial Bold Italic", Georgia, serif; }
p#test1d { color: black; }
p#test2d { color: red; }
p#test3d { color: red; }
p#test4d { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1d">{ font-family: "Arial", sans-serif; }</p>
<p id="test2d">{ font-family: "Arial Bold", Georgia, serif; }</p>
<p id="test3d">{ font-family: "Arial Italic", Georgia, serif; }</p>
<p id="test4d">{ font-family: "Arial Bold Italic", Georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1e { font-family: Arial, sans-serif; }
p#test2e { font-family: Georgia, serif; }
p#test3e { font-family: Georgia, serif; }
p#test4e { font-family: Georgia, serif; }
p#test1e { color: black; }
p#test2e { color: red; }
p#test3e { color: red; }
p#test4e { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1e">{ font-family: "arial", sans-serif; }</p>
<p id="test2e">{ font-family: "arial bold", georgia, serif; }</p>
<p id="test3e">{ font-family: "arial italic", georgia, serif; }</p>
<p id="test4e">{ font-family: "arial bold italic", georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Arial Variations</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
p#test1e { font-family: "arial", sans-serif; }
p#test2e { font-family: "arial bold", georgia, serif; }
p#test3e { font-family: "arial italic", georgia, serif; }
p#test4e { font-family: "arial bold italic", georgia, serif; }
p#test1e { color: black; }
p#test2e { color: red; }
p#test3e { color: red; }
p#test4e { color: red; }
#tests {
font-size: 18pt;
margin-left: 0.5em;
}
</style>
</head>
<body>
<p>Text in black should appear in Arial and text in red in Georgia or the default serif font:</p>
<div id="tests">
<p id="test1e">{ font-family: "arial", sans-serif; }</p>
<p id="test2e">{ font-family: "arial bold", georgia, serif; }</p>
<p id="test3e">{ font-family: "arial italic", georgia, serif; }</p>
<p id="test4e">{ font-family: "arial bold italic", georgia, serif; }</p>
</div>
</body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Arial Unicode MS, serif; font-weight: bold; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Arial Unicode MS, serif; font-weight: bold; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Arial Unicode MS, serif; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Arial Unicode MS, serif; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Arial Unicode MS, serif; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Test for bold when system fallback is used</title>
</head>
<body>
<!--
-- On OS X and Win7, the Plantagenet Cherokee font is only available in Regular weight.
--
-- Cherokee text including <b> elements taken from
-- http://chr.wikipedia.org/wiki/%E1%8F%A9%E1%8E%A6%E1%8F%A7%E1%8E%A7%E1%8F%85%E1%8F%8D%E1%8F%95%E1%8E%BE_%E1%8E%A4%E1%8F%82%E1%8E%BE%E1%8F%97%E1%8F%85%E1%8F%97
--
-->
<p>ᏩᎦᏧᎧᏅᏍᏕᎾ ᎤᏂᎾᏗᏅᏗ ᎨᏒᎢ ᎠᏂᏙᎾᎥ ᎠᎴᏫᏍᏙᏗ ᎢᏳᏩᎪᏗ ᎯᎳᎪ ᎢᏳ ᏚᏂᎬᏩᎶᏔᏅ ᎠᎴ ᎠᎵᏌᎳᏗᏍᎬ
ᎭᏫᎾᏗᏢ ᎠᏕᎸ ᏄᎾᏍᏛ ᎤᏂᎾᏗᏅᏗ ᎦᏣᏄᎳᎯᎨ ᎬᎾᏬᏍᎬ ᎤᎾᏤᎵ ᎧᏃᎮᏍᎩ ᏄᎵᏍᏔᏅ ᎢᎦᏘᎭ ᎢᎬᏁᎸ, ᎭᏫᎾᏗᏢ ᏧᏓᎴᎾᎢ
ᎠᎵᏐᏆᎸᏗ ᎤᏂᎾᏗᏅᏗ ᎦᏙ ᎤᏍᏗ ᎨᏒᎢ ᎠᏂᏙᎾᎥ ᎠᎴᏫᏍᏙᏗ ᎢᏳᏩᎪᏗ ᎯᎳᎪ ᎢᏳ ᏚᏂᎬᏩᎶᏔᏅ ᎠᎴ ᎦᎶᏍᎬ.</p>
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Test for bold when system fallback is used</title>
</head>
<body>
<!--
-- On OS X and Win7, the Plantagenet Cherokee font is only available in Regular weight.
--
-- Cherokee text including <b> elements taken from
-- http://chr.wikipedia.org/wiki/%E1%8F%A9%E1%8E%A6%E1%8F%A7%E1%8E%A7%E1%8F%85%E1%8F%8D%E1%8F%95%E1%8E%BE_%E1%8E%A4%E1%8F%82%E1%8E%BE%E1%8F%97%E1%8F%85%E1%8F%97
--
-->
<p><b>ᏩᎦᏧᎧᏅᏍᏕᎾ ᎤᏂᎾᏗᏅᏗ</b> ᎨᏒᎢ ᎠᏂᏙᎾᎥ ᎠᎴᏫᏍᏙᏗ ᎢᏳᏩᎪᏗ ᎯᎳᎪ ᎢᏳ ᏚᏂᎬᏩᎶᏔᏅ ᎠᎴ ᎠᎵᏌᎳᏗᏍᎬ
ᎭᏫᎾᏗᏢ ᎠᏕᎸ ᏄᎾᏍᏛ ᎤᏂᎾᏗᏅᏗ ᎦᏣᏄᎳᎯᎨ ᎬᎾᏬᏍᎬ ᎤᎾᏤᎵ ᎧᏃᎮᏍᎩ ᏄᎵᏍᏔᏅ ᎢᎦᏘᎭ ᎢᎬᏁᎸ, ᎭᏫᎾᏗᏢ ᏧᏓᎴᎾᎢ
<b>ᎠᎵᏐᏆᎸᏗ ᎤᏂᎾᏗᏅᏗ</b> ᎦᏙ ᎤᏍᏗ ᎨᏒᎢ ᎠᏂᏙᎾᎥ ᎠᎴᏫᏍᏙᏗ ᎢᏳᏩᎪᏗ ᎯᎳᎪ ᎢᏳ ᏚᏂᎬᏩᎶᏔᏅ ᎠᎴ ᎦᎶᏍᎬ.</p>
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Test for bold when system fallback is used</title>
</head>
<body>
<!--
-- Chess symbols will use Droid Sans Fallback on Android,
-- which only has a single weight.
--
-- On some platforms there may be "regular" glyphs in the Bold face
-- of the fallback font used (e.g. Menlo on OS X), so this will
-- not reliably pass there.
-->
<p>&#x2654;&#x2655;&#x2656;&#x2657;&#x2658;&#x2659;</p>
<p>&#x2654;&#x2655;&#x2656;&#x2657;&#x2658;&#x2659;</p>
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<title>Test for bold when system fallback is used</title>
</head>
<body>
<!--
-- Chess symbols will use Droid Sans Fallback on Android,
-- which only has a single weight.
--
-- On some platforms there may be "regular" glyphs in the Bold face
-- of the fallback font used (e.g. Menlo on OS X), so this will
-- not reliably pass there.
-->
<p>&#x2654;&#x2655;&#x2656;&#x2657;&#x2658;&#x2659;</p>
<p><b>&#x2654;&#x2655;&#x2656;&#x2657;&#x2658;&#x2659;</b></p>
</body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-weight: bold; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-weight: bold; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-style: oblique; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
</style>
</head>
<body><p>Bongo</p></body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-weight: bold; font-style: normal; }
</style>
</head>
<body><p id="test">魅力的な人</p></body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-weight: bold; font-style: italic; }
</style>
</head>
<body><p id="test">魅力的な人</p></body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-weight: normal; font-style: italic; }
</style>
</head>
<body><p id="test">魅力的な人</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-style: oblique; }
</style>
</head>
<body><p id="test">魅力的な人</p></body>
</html>

View file

@ -0,0 +1,9 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-weight: normal; font-style: normal; }
</style>
</head>
<body><p id="test">魅力的な人</p></body>
</html>

View file

@ -0,0 +1,16 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Escaped family names test</title>
<meta charset="UTF-8">
<style>
body { margin: 20px; }
#test, #test2 { font-family: serif; }
</style>
</head>
<body>
<p id=test>Should be serif</p>
<p id=test2>Should be serif</p>
</body>
</html>

View file

@ -0,0 +1,17 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Escaped family names test</title>
<meta charset="UTF-8">
<style>
body { margin: 20px; }
#test { font-family: \20 Arial, \20 Verdana, \20 Deja Vu Sans, \20 Fira Sans, \20 Fira Sans OT, serif; }
#test2 { font-family: Arial\20 , Verdana\20 , Deja Vu Sans\20 , Fira Sans\20 , Fira Sans OT\20 , serif; }
</style>
</head>
<body>
<p id=test>Should be serif</p>
<p id=test2>Should be serif</p>
</body>
</html>

View file

@ -0,0 +1,79 @@
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
/* load 9 faces of DejaVu Sans in the "dvs" family, with appropriate style descriptors */
@font-face {
font-family: dvs;
src: url(../fonts/dejavu-sans/DejaVuSans.ttf);
}
@font-face {
font-family: dvs;
font-weight: bold;
src: url(../fonts/dejavu-sans/DejaVuSans-Bold.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
src: url(../fonts/dejavu-sans/DejaVuSans-Oblique.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
font-weight: bold;
src: url(../fonts/dejavu-sans/DejaVuSans-BoldOblique.ttf);
}
@font-face { /* note that there is no ExtraLight Condensed or Oblique */
font-family: dvs;
font-weight: 200;
src: url(../fonts/dejavu-sans/DejaVuSans-ExtraLight.ttf);
}
@font-face {
font-family: dvs;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed.ttf);
}
@font-face {
font-family: dvs;
font-weight: bold;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-Bold.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-Oblique.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
font-weight: bold;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-BoldOblique.ttf);
}
body {
font-family: dvs, serif;
font-size: 24px;
}
.l {
font-weight: 200;
}
</style>
</head>
<body>
<!-- all 4 levels of "condensed" come out the same; "condensed" takes priority over "light" -->
<div style="font: ultra-condensed 24px dvs, serif">ultra-condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font: extra-condensed 24px dvs, serif">extra-condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font: condensed 24px dvs, serif">condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font: semi-condensed 24px dvs, serif">semi-condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<!-- "normal" and all 4 levels of "expanded" come out the same; "light" is available, but only in upright, not italic -->
<div style="font: 24px dvs">normal <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font: semi-expanded 24px dvs, serif">semi-expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font: expanded 24px dvs, serif">expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font: extra-expanded 24px dvs, serif">extra-expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font: ultra-expanded 24px dvs, serif">ultra-expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
</body>
</html>

View file

@ -0,0 +1,73 @@
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
/* each face is loaded as a separate family, so we can address them individually
without involving the style-matching algorithm */
@font-face {
font-family: dvs;
src: url(../fonts/dejavu-sans/DejaVuSans.ttf);
}
@font-face {
font-family: dvsb;
src: url(../fonts/dejavu-sans/DejaVuSans-Bold.ttf);
}
@font-face {
font-family: dvsi;
src: url(../fonts/dejavu-sans/DejaVuSans-Oblique.ttf);
}
@font-face {
font-family: dvsbi;
src: url(../fonts/dejavu-sans/DejaVuSans-BoldOblique.ttf);
}
@font-face { /* note that there is no ExtraLight Condensed or Oblique */
font-family: dvsl;
src: url(../fonts/dejavu-sans/DejaVuSans-ExtraLight.ttf);
}
@font-face {
font-family: dvsc;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed.ttf);
}
@font-face {
font-family: dvscb;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-Bold.ttf);
}
@font-face {
font-family: dvsci;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-Oblique.ttf);
}
@font-face {
font-family: dvscbi;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-BoldOblique.ttf);
}
body {
font-family: dvs, serif;
font-size: 24px;
}
.b { font-family: dvsb; }
.i { font-family: dvsi; }
.bi { font-family: dvsbi; }
.l { font-family: dvsl; }
.c { font-family: dvsc; }
.cb { font-family: dvscb; }
.ci { font-family: dvsci; }
.cbi { font-family: dvscbi; }
</style>
</head>
<body>
<!-- all 4 levels of "condensed" come out the same; "condensed" takes priority over "light" -->
<div class="c">ultra-condensed <span class="ci">italic</span> <span class="cb">bold <span class="cbi">italic</span></span> <span class="c">light <span class="ci">italic</span></span></div>
<div class="c">extra-condensed <span class="ci">italic</span> <span class="cb">bold <span class="cbi">italic</span></span> <span class="c">light <span class="ci">italic</span></span></div>
<div class="c">condensed <span class="ci">italic</span> <span class="cb">bold <span class="cbi">italic</span></span> <span class="c">light <span class="ci">italic</span></span></div>
<div class="c">semi-condensed <span class="ci">italic</span> <span class="cb">bold <span class="cbi">italic</span></span> <span class="c">light <span class="ci">italic</span></span></div>
<!-- "normal" and all 4 levels of "expanded" come out the same; "light" is available, but only in upright, not italic -->
<div>normal <span class="i">italic</span> <span class="b">bold <span class="bi">italic</span></span> <span class="l">light <span class="i">italic</span></span></div>
<div>semi-expanded <span class="i">italic</span> <span class="b">bold <span class="bi">italic</span></span> <span class="l">light <span class="i">italic</span></span></div>
<div>expanded <span class="i">italic</span> <span class="b">bold <span class="bi">italic</span></span> <span class="l">light <span class="i">italic</span></span></div>
<div>extra-expanded <span class="i">italic</span> <span class="b">bold <span class="bi">italic</span></span> <span class="l">light <span class="i">italic</span></span></div>
<div>ultra-expanded <span class="i">italic</span> <span class="b">bold <span class="bi">italic</span></span> <span class="l">light <span class="i">italic</span></span></div>
</body>
</html>

View file

@ -0,0 +1,79 @@
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
/* load 9 faces of DejaVu Sans in the "dvs" family, with appropriate style descriptors */
@font-face {
font-family: dvs;
src: url(../fonts/dejavu-sans/DejaVuSans.ttf);
}
@font-face {
font-family: dvs;
font-weight: bold;
src: url(../fonts/dejavu-sans/DejaVuSans-Bold.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
src: url(../fonts/dejavu-sans/DejaVuSans-Oblique.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
font-weight: bold;
src: url(../fonts/dejavu-sans/DejaVuSans-BoldOblique.ttf);
}
@font-face { /* note that there is no ExtraLight Condensed or Oblique */
font-family: dvs;
font-weight: 200;
src: url(../fonts/dejavu-sans/DejaVuSans-ExtraLight.ttf);
}
@font-face {
font-family: dvs;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed.ttf);
}
@font-face {
font-family: dvs;
font-weight: bold;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-Bold.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-Oblique.ttf);
}
@font-face {
font-family: dvs;
font-style: italic;
font-weight: bold;
font-stretch: condensed;
src: url(../fonts/dejavu-sans/DejaVuSansCondensed-BoldOblique.ttf);
}
body {
font-family: dvs, serif;
font-size: 24px;
}
.l {
font-weight: 200;
}
</style>
</head>
<body>
<!-- all 4 levels of "condensed" come out the same; "condensed" takes priority over "light" -->
<div style="font-stretch: ultra-condensed">ultra-condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font-stretch: extra-condensed">extra-condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font-stretch: condensed">condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font-stretch: semi-condensed">semi-condensed <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<!-- "normal" and all 4 levels of "expanded" come out the same; "light" is available, but only in upright, not italic -->
<div style="font-stretch: normal">normal <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font-stretch: semi-expanded">semi-expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font-stretch: expanded">expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font-stretch: extra-expanded">extra-expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
<div style="font-stretch: ultra-expanded">ultra-expanded <i>italic</i> <b>bold <i>italic</i></b> <span class="l">light <i>italic</i></span></div>
</body>
</html>

View file

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
@font-face {
font-family: test;
src: url(../fonts/sil/GenR102.ttf);
}
body {
font-family: test; /* family that lacks bold and italic faces */
font-size: 36px;
margin: 1em;
}
</style>
</head>
<body>
<p>Hello, <i>cruel</i> <b>world<i>!</i></b>
<p>Hello, cruel <b>world!</b>
<p>Hello, <i>cruel</i> world<i>!</i>
<p>Hello, cruel world!
</body>
</html>

View file

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
@font-face {
font-family: test;
src: url(../fonts/sil/GenR102.ttf);
}
body {
font-family: test; /* family that lacks bold and italic faces */
font-size: 36px;
margin: 1em;
}
</style>
</head>
<body>
<p>Hello, <i>cruel</i> <b>world<i>!</i></b>
<p style="font-synthesis:weight">Hello, <i>cruel</i> <b>world<i>!</i></b>
<p style="font-synthesis:style">Hello, <i>cruel</i> <b>world<i>!</i></b>
<p style="font-synthesis:none">Hello, <i>cruel</i> <b>world<i>!</i></b>
</body>
</html>

View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
@font-face {
font-family: test;
src: url(../fonts/sil/GenR102.ttf);
}
body {
/* try for a locally-installed font that lacks Bold and Italic faces */
font-family: Papyrus, /* OS X */
Microsoft Sans Serif, /* Windows */
/* XXX no idea what to try for Linux desktop systems :( */
Droid Sans Fallback, /* Android, B2G */
test; /* fallback to avoid failures on "none of the above" */
font-size: 36px;
margin: 1em;
}
</style>
</head>
<body>
<p>Hello, <i>cruel</i> <b>world<i>!</i></b>
<p>Hello, cruel <b>world!</b>
<p>Hello, <i>cruel</i> world<i>!</i>
<p>Hello, cruel world!
</body>
</html>

View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
@font-face {
font-family: test;
src: url(../fonts/sil/GenR102.ttf);
}
body {
/* try for a locally-installed font that lacks Bold and Italic faces */
font-family: Papyrus, /* OS X */
Microsoft Sans Serif, /* Windows */
/* XXX no idea what to try for Linux desktop systems :( */
Droid Sans Fallback, /* Android, B2G */
test; /* fallback to avoid failures on "none of the above" */
font-size: 36px;
margin: 1em;
}
</style>
</head>
<body>
<p>Hello, <i>cruel</i> <b>world<i>!</i></b>
<p style="font-synthesis:weight">Hello, <i>cruel</i> <b>world<i>!</i></b>
<p style="font-synthesis:style">Hello, <i>cruel</i> <b>world<i>!</i></b>
<p style="font-synthesis:none">Hello, <i>cruel</i> <b>world<i>!</i></b>
</body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Impact, serif; font-weight: bold; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Impact, serif; font-weight: bold; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Impact, serif; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Impact, serif; font-style: oblique; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: Impact, serif; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,31 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
font-style: italic;
}
body { margin: 30px }
p { margin: 0; font: italic 600% test, serif; }
</style>
</head>
<body>
<p>BBB</p>
</body>
</html>

View file

@ -0,0 +1,31 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test;
src: url(../fonts/markC.woff);
font-style: oblique;
}
body { margin: 30px }
p { margin: 0; font: italic 600% test, serif; }
</style>
</head>
<body>
<p>CCC</p>
</body>
</html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
font-style: italic;
}
@font-face {
font-family: test;
src: url(../fonts/mark2B.woff);
font-style: oblique;
}
body { margin: 30px }
p { margin: 0; font: italic 600% test, serif; }
</style>
</head>
<body>
<p>BBB</p>
</body>
</html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test;
src: url(../fonts/mark2B.woff);
font-style: oblique;
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
font-style: italic;
}
body { margin: 30px }
p { margin: 0; font: italic 600% test, serif; }
</style>
</head>
<body>
<p>BBB</p>
</body>
</html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test;
src: url(../fonts/mark2B.woff);
font-style: italic;
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
font-style: oblique;
}
body { margin: 30px }
p { margin: 0; font: oblique 600% test, serif; }
</style>
</head>
<body>
<p>BBB</p>
</body>
</html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
font-style: italic;
}
@font-face {
font-family: test;
src: url(../fonts/markC.woff);
font-style: oblique;
}
body { margin: 30px }
p { margin: 0; font: oblique 600% test, serif; }
</style>
</head>
<body>
<p>CCC</p>
</body>
</html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
font-style: oblique;
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
}
@font-face {
font-family: test;
src: url(../fonts/mark2B.woff);
font-style: italic;
}
body { margin: 30px }
p { margin: 0; font: oblique 600% test, serif; }
</style>
</head>
<body>
<p>AAA</p>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test1;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test2;
src: url(../fonts/markB.woff);
font-style: italic;
}
@font-face {
font-family: test3;
src: url(../fonts/markC.woff);
font-style: oblique;
}
@font-face {
font-family: test3;
src: url(../fonts/mark2C.woff);
font-style: italic;
}
body { margin: 30px }
p { margin: 0; font: oblique 600% test1, test2, test3, serif; }
</style>
</head>
<body>
<p>CCC</p>
</body>
</html>

View file

@ -0,0 +1,43 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test1;
src: url(../fonts/markA.woff);
}
@font-face {
font-family: test2;
src: url(../fonts/markC.woff);
font-style: italic;
}
@font-face {
font-family: test3;
src: url(../fonts/mark2C.woff);
font-style: oblique;
}
@font-face {
font-family: test3;
src: url(../fonts/mark2A.woff);
font-style: italic;
}
body { margin: 30px }
p { margin: 0; font: oblique 600% test1, test2, test3, serif; }
</style>
</head>
<body>
<p>CCC</p>
</body>
</html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/mark2A.woff);
font-style: oblique;
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
}
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
font-style: italic;
}
body { margin: 30px }
p { margin: 0; font: italic 300% kinnari, test, serif; }
</style>
</head>
<body>
<p>AAA</p>
</body>
</html>

View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/mark2A.woff);
font-style: oblique;
}
@font-face {
font-family: test;
src: url(../fonts/markB.woff);
}
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
font-style: italic;
}
body { margin: 30px }
p { margin: 0; font: oblique 300% kinnari, test, serif; }
</style>
</head>
<body>
<p>AAA</p>
</body>
</html>

View file

@ -0,0 +1,24 @@
<!DOCTYPE HTML>
<head>
<title>style matching - italic/oblique</title>
<link rel="author" title="John Daggett" href="mailto:jdaggett@mozilla.com">
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-prop">
<link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-style-matching">
<link rel="match" href="italic-oblique-1-ref.html">
<meta name="flags" content="font matching must distinguish between italic and oblique">
<style>
@font-face {
font-family: test;
src: url(../fonts/markA.woff);
}
body { margin: 30px }
p { margin: 0; font: 600% test, serif; }
</style>
</head>
<body>
<p>AAA</p>
</body>
</html>

View file

@ -0,0 +1,46 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names (ref)</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test2 { font-family: "Apple LiSung"; }
#test3 { font-family: "BatangChe"; }
#test9 { font-family: "Dotum"; }
#test10 { font-family: "FangSong"; }
#test12 { font-family: "Gulim"; }
#test14 { font-family: "Gungsuh"; }
#test15 { font-family: "HY Kak Headline Std"; }
#test17 { font-family: "Hiragino Kaku Gothic Pro"; }
#test18 { font-family: "Hiragino Kaku Gothic StdN"; }
#test19 { font-family: "Hiragino Kaku Gothic Std"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test2">蘋果儷細宋 Apple LiSung</p>
<p id="test3">바탕체 BatangChe</p>
<p id="test9">돋움 Dotum</p>
<p id="test10">仿宋 FangSong</p>
<p id="test12">굴림 Gulim</p>
<p id="test14">궁서 Gungsuh</p>
<p id="test15">HY각헤드라인 Std HY Kak Headline Std</p>
<p id="test17">ヒラギノ角ゴ Pro Hiragino Kaku Gothic Pro</p>
<p id="test18">ヒラギノ角ゴ StdN Hiragino Kaku Gothic StdN</p>
<p id="test19">ヒラギノ角ゴ Std Hiragino Kaku Gothic Std</p>
</body>
</html>

View file

@ -0,0 +1,46 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test2 { font-family: "蘋果儷細宋"; }
#test3 { font-family: "바탕체"; }
#test9 { font-family: "돋움"; }
#test10 { font-family: "仿宋"; }
#test12 { font-family: "굴림"; }
#test14 { font-family: "궁서"; }
#test15 { font-family: "HY각헤드라인 Std"; }
#test17 { font-family: "ヒラギノ角ゴ Pro"; }
#test18 { font-family: "ヒラギノ角ゴ StdN"; }
#test19 { font-family: "ヒラギノ角ゴ Std"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test2">蘋果儷細宋 Apple LiSung</p>
<p id="test3">바탕체 BatangChe</p>
<p id="test9">돋움 Dotum</p>
<p id="test10">仿宋 FangSong</p>
<p id="test12">굴림 Gulim</p>
<p id="test14">궁서 Gungsuh</p>
<p id="test15">HY각헤드라인 Std HY Kak Headline Std</p>
<p id="test17">ヒラギノ角ゴ Pro Hiragino Kaku Gothic Pro</p>
<p id="test18">ヒラギノ角ゴ StdN Hiragino Kaku Gothic StdN</p>
<p id="test19">ヒラギノ角ゴ Std Hiragino Kaku Gothic Std</p>
</body>
</html>

View file

@ -0,0 +1,46 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names (ref)</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test20 { font-family: "Hiragino Maru Gothic ProN"; }
#test22 { font-family: "Hiragino Mincho ProN"; }
#test23 { font-family: "Hiragino Mincho Pro"; }
#test24 { font-family: "KaiTi"; }
#test30 { font-family: "LiHei Pro"; }
#test31 { font-family: "LiSong Pro"; }
#test33 { font-family: "MS Mincho"; }
#test34 { font-family: "MS PGothic"; }
#test35 { font-family: "MS PMincho"; }
#test36 { font-family: "Malgun Gothic"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test20">ヒラギノ丸ゴ ProN Hiragino Maru Gothic ProN</p>
<p id="test22">ヒラギノ明朝 ProN Hiragino Mincho ProN</p>
<p id="test23">ヒラギノ明朝 Pro Hiragino Mincho Pro</p>
<p id="test24">楷体 KaiTi</p>
<p id="test30">儷黑 Pro LiHei Pro</p>
<p id="test31">儷宋 Pro LiSong Pro</p>
<p id="test33">MS 明朝 MS Mincho</p>
<p id="test34">MS Pゴシック MS PGothic</p>
<p id="test35">MS P明朝 MS PMincho</p>
<p id="test36">맑은 고딕 Malgun Gothic</p>
</body>
</html>

View file

@ -0,0 +1,46 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test20 { font-family: "ヒラギノ丸ゴ ProN"; }
#test22 { font-family: "ヒラギノ明朝 ProN"; }
#test23 { font-family: "ヒラギノ明朝 Pro"; }
#test24 { font-family: "楷体"; }
#test30 { font-family: "儷黑 Pro"; }
#test31 { font-family: "儷宋 Pro"; }
#test33 { font-family: "MS 明朝"; }
#test34 { font-family: "MS Pゴシック"; }
#test35 { font-family: "MS P明朝"; }
#test36 { font-family: "맑은 고딕"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test20">ヒラギノ丸ゴ ProN Hiragino Maru Gothic ProN</p>
<p id="test22">ヒラギノ明朝 ProN Hiragino Mincho ProN</p>
<p id="test23">ヒラギノ明朝 Pro Hiragino Mincho Pro</p>
<p id="test24">楷体 KaiTi</p>
<p id="test30">儷黑 Pro LiHei Pro</p>
<p id="test31">儷宋 Pro LiSong Pro</p>
<p id="test33">MS 明朝 MS Mincho</p>
<p id="test34">MS Pゴシック MS PGothic</p>
<p id="test35">MS P明朝 MS PMincho</p>
<p id="test36">맑은 고딕 Malgun Gothic</p>
</body>
</html>

View file

@ -0,0 +1,46 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names (ref)</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test37 { font-family: "Meiryo"; }
#test38 { font-family: "Microsoft JhengHei"; }
#test39 { font-family: "Microsoft YaHei"; }
#test40 { font-family: "MingLiU-ExtB"; }
#test41 { font-family: "MingLiU"; }
#test43 { font-family: "MingLiU_HKSCS"; }
#test44 { font-family: "NSimSun"; }
#test46 { font-family: "PMingLiU"; }
#test47 { font-family: "Raanana"; }
#test48 { font-family: "STFangsong"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test37">メイリオ Meiryo</p>
<p id="test38">微軟正黑體 Microsoft JhengHei</p>
<p id="test39">微软雅黑 Microsoft YaHei</p>
<p id="test40">細明體-ExtB MingLiU-ExtB</p>
<p id="test41">細明體 MingLiU</p>
<p id="test43">細明體_HKSCS MingLiU_HKSCS</p>
<p id="test44">新宋体 NSimSun</p>
<p id="test46">新細明體 PMingLiU</p>
<p id="test47">רעננה Raanana</p>
<p id="test48">华文仿宋 STFangsong</p>
</body>
</html>

View file

@ -0,0 +1,46 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test37 { font-family: "メイリオ"; }
#test38 { font-family: "微軟正黑體"; }
#test39 { font-family: "微软雅黑"; }
#test40 { font-family: "細明體-ExtB"; }
#test41 { font-family: "細明體"; }
#test43 { font-family: "細明體_HKSCS"; }
#test44 { font-family: "新宋体"; }
#test46 { font-family: "新細明體"; }
#test47 { font-family: "רעננה"; }
#test48 { font-family: "华文仿宋"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test37">メイリオ Meiryo</p>
<p id="test38">微軟正黑體 Microsoft JhengHei</p>
<p id="test39">微软雅黑 Microsoft YaHei</p>
<p id="test40">細明體-ExtB MingLiU-ExtB</p>
<p id="test41">細明體 MingLiU</p>
<p id="test43">細明體_HKSCS MingLiU_HKSCS</p>
<p id="test44">新宋体 NSimSun</p>
<p id="test46">新細明體 PMingLiU</p>
<p id="test47">רעננה Raanana</p>
<p id="test48">华文仿宋 STFangsong</p>
</body>
</html>

View file

@ -0,0 +1,38 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names (ref)</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test49 { font-family: "STHeiti"; }
#test51 { font-family: "STSong"; }
#test52 { font-family: "Sazanami Gothic"; }
#test53 { font-family: "Sazanami Mincho"; }
#test54 { font-family: "SimHei"; }
#test55 { font-family: "SimSun"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test49">华文黑体 STHeiti</p>
<p id="test51">华文宋体 STSong</p>
<p id="test52">さざなみゴシック Sazanami Gothic</p>
<p id="test53">さざなみ明朝 Sazanami Mincho</p>
<p id="test54">黑体 SimHei</p>
<p id="test55">宋体 SimSun</p>
</body>
</html>

View file

@ -0,0 +1,38 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Localized font family names</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 24px;
}
#test49 { font-family: "华文黑体"; }
#test51 { font-family: "华文宋体"; }
#test52 { font-family: "さざなみゴシック"; }
#test53 { font-family: "さざなみ明朝"; }
#test54 { font-family: "黑体"; }
#test55 { font-family: "宋体"; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p id="test49">华文黑体 STHeiti</p>
<p id="test51">华文宋体 STSong</p>
<p id="test52">さざなみゴシック Sazanami Gothic</p>
<p id="test53">さざなみ明朝 Sazanami Mincho</p>
<p id="test54">黑体 SimHei</p>
<p id="test55">宋体 SimSun</p>
</body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: "Lucida Console", serif; font-weight: bold; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: "Lucida Console", serif; font-weight: bold; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: "Lucida Console", serif; font-style: italic; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: "Lucida Console", serif; font-style: oblique; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,10 @@
<!DOCTYPE HTML><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { margin: 50px; font-size: 72pt; }
#test { font-family: "Lucida Console", serif; }
</style>
</head>
<body><p id="test">Bongo</p></body>
</html>

View file

@ -0,0 +1,42 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Mapping 400 to medium</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
@font-face {
font-family: mplus1p;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: mplus1p;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
p { font-size: 24pt; font-family: mplus1p; font-weight: 200; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<h4>The two lines below should match</h4>
<p id="test1">Fiddling fiddlesticks!</p>
<p id="test2">Fiddling fiddlesticks!</p>
</body>
</html>

View file

@ -0,0 +1,42 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Mapping 400 to medium</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
@font-face {
font-family: mplus1p;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: mplus1p;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
p { font-size: 24pt; font-family: mplus1p; font-weight: normal; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<h4>The two lines below should match</h4>
<p id="test1">Fiddling fiddlesticks!</p>
<p id="test2">Fiddling fiddlesticks!</p>
</body>
</html>

View file

@ -0,0 +1,44 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Mapping 400 to medium</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
}
@font-face {
font-family: mplus1p;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: mplus1p;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
p { font-size: 24pt; }
#test1 { font-family: mplus1p; font-weight: normal; }
#test2 { font-family: mplus1p; font-weight: 500; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<h4>The two lines below should match</h4>
<p id="test1">Fiddling fiddlesticks!</p>
<p id="test2">Fiddling fiddlesticks!</p>
</body>
</html>

View file

@ -0,0 +1,143 @@
# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
== CSS21-t1502-no-inherited-font-family.xhtml CSS21-t1502-no-inherited-font-family.xhtml
# basic tests for bug 538730
== synthetic-bold-1.html synthetic-bold-1.html
== synthetic-bold-2.html synthetic-bold-2.html
# synthetic bold/italic tests
== defaultfont-bold.html defaultfont-bold.html
== defaultfont-italic.html defaultfont-italic.html
== defaultfont-oblique.html defaultfont-oblique.html
== defaultfont-bolditalic.html defaultfont-bolditalic.html
== defaultfont-bolditalic.html defaultfont-bolditalic.html
== defaultjapanese-bold.html defaultjapanese-bold.html
== defaultjapanese-italic.html defaultjapanese-italic.html
== defaultjapanese-oblique.html defaultjapanese-oblique.html
== defaultjapanese-bolditalic.html defaultjapanese-bolditalic.html
== defaultjapanese-bolditalic.html defaultjapanese-bolditalic.html
random-if(cocoaWidget) == impact-bold.html impact-bold.html
# bug 539418
== impact-italic.html impact-italic.html
== impact-oblique.html impact-oblique.html
== impact-bolditalic.html impact-bolditalic.html
== impact-bolditalic.html impact-bolditalic.html
== arialunicode-bold.html arialunicode-bold.html
== arialunicode-italic.html arialunicode-italic.html
== arialunicode-oblique.html arialunicode-oblique.html
== arialunicode-bolditalic.html arialunicode-bolditalic.html
== arialunicode-bolditalic.html arialunicode-bolditalic.html
== lucidaconsole-bold.html lucidaconsole-bold.html
== lucidaconsole-italic.html lucidaconsole-italic.html
== lucidaconsole-oblique.html lucidaconsole-oblique.html
== lucidaconsole-bolditalic.html lucidaconsole-bolditalic.html
== lucidaconsole-bolditalic.html lucidaconsole-bolditalic.html
# checking that we don't match fullnames, psnames (see bug 538103)
== arial-variations-1.html arial-variations-1.html
== arial-variations-2.html arial-variations-2.html
== arial-variations-3.html arial-variations-3.html
== arial-variations-4.html arial-variations-4.html
== arial-variations-5.html arial-variations-5.html
== arial-variations-6.html arial-variations-6.html
# localized font family names should always match just as English names do
== localized-family-names-001.html localized-family-names-001.html
skip-if(Mulet) == localized-family-names-002.html localized-family-names-002.html
# MULET: Bug 1144079: Re-enable Mulet mochitests and reftests taskcluster-specific disables
fails-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)&&!d2d) == localized-family-names-003.html localized-family-names-003.html
# Bug 1258248
== localized-family-names-004.html localized-family-names-004.html
# family names with escaped spaces shouldn't match the names without the spaces
== familyname-escapedidents.html familyname-escapedidents.html
# weight mapping tests
skip-if(B2G||Mulet) HTTP(..) == normalmedium.html normalmedium.html
# bug 773482
# Initial mulet triage: parity with B2G/B2G Desktop
skip-if(B2G||Mulet) HTTP(..) == normalmedium.html normalmedium.html
# bug 773482
# Initial mulet triage: parity with B2G/B2G Desktop
# Linux fails due to bug 604815
skip fuzzy-if(OSX==1010&&browserIsRemote,1,23) HTTP(..) == weightmapping-12.html weightmapping-12.html
skip HTTP(..) == weightmapping-25.html weightmapping-25.html
skip HTTP(..) == weightmapping-45.html weightmapping-45.html
skip HTTP(..) == weightmapping-458.html weightmapping-458.html
skip HTTP(..) == weightmapping-478.html weightmapping-478.html
skip HTTP(..) == weightmapping-7.html weightmapping-7.html
skip fuzzy-if(OSX==1010,1,30) HTTP(..) == weightmapping-12579.html weightmapping-12579.html
skip skip-if(B2G||Mulet) HTTP(..) == stretchmapping-all.html stretchmapping-all.html
# bug 773482
# Initial mulet triage: parity with B2G/B2G Desktop
skip skip-if(B2G||Mulet) HTTP(..) == stretchmapping-reverse.html stretchmapping-reverse.html
# Initial mulet triage: parity with B2G/B2G Desktop
skip fuzzy-if(OSX==1010&&browserIsRemote,1,17) fuzzy-if(Android,4,8) HTTP(..) == stretchmapping-35.html stretchmapping-35.html
skip fuzzy-if(OSX==1010,3,5) HTTP(..) == stretchmapping-137.html stretchmapping-137.html
# test for font-stretch using @font-face
skip-if(B2G||Mulet) skip-if(Android) HTTP(..) == font-stretch-1.html font-stretch-1.html
# bugs 773482, 927602
# Initial mulet triage: parity with B2G/B2G Desktop
skip-if(B2G||Mulet) skip-if(Android) HTTP(..) == font-shorthand-stretch-1.html font-shorthand-stretch-1.html
# bugs 773482, 927602
# Initial mulet triage: parity with B2G/B2G Desktop
# bug 724231 - applying synthetic styles to a single @font-face font
# should apply artificial obliquing, not switch to a true styled face
== synthetic-style-1.html synthetic-style-1.html
== synthetic-style-2.html synthetic-style-2.html
# Bug 765906 - synthetic bold should be used if necessary together with system fallback.
# **NOTE** we skip these on Linux because of bug 769659.
# test 1 uses Cherokee; expected to pass on OS X and Win7
random-if(!(cocoaWidget||/^Windows\x20NT\x206\.1/.test(http.oscpu))) skip-if(gtkWidget) == bold-system-fallback-1.html bold-system-fallback-1.html
# test 2 uses Chess symbols; expected to pass on Android
random-if(!Android) skip-if(gtkWidget) == bold-system-fallback-2.html bold-system-fallback-2.html
# Bug 769475 - applying 'italic' to Arabic text in Arial should NOT change family or metrics.
# Expected to pass on MacOSX and Windows; other platforms unknown, depending on font availability.
random-if(!(cocoaWidget||winWidget)) == arial-arabic.html arial-arabic.html
== syntheticbold-rotated.html syntheticbold-rotated.html
HTTP(..) == font-synthesis-1.html font-synthesis-1.html
skip-if(Mulet) HTTP(..) == font-synthesis-2.html font-synthesis-2.html
# MULET: Bug 1144079: Re-enable Mulet mochitests and reftests taskcluster-specific disables
# Bug 1060791 - support for format 10 cmap in Apple Symbols;
# relevant fonts not present on other platforms.
skip skip-if(!cocoaWidget) HTTP(..) == apple-symbols-1.html apple-symbols-1.html
# distinguish between italic and oblique
== simple-oblique.html simple-oblique.html
== italic-oblique-1.html italic-oblique-1.html
== italic-oblique-2.html italic-oblique-2.html
== italic-oblique-3.html italic-oblique-3.html
== italic-oblique-4.html italic-oblique-4.html
== italic-oblique-5.html italic-oblique-5.html
== italic-oblique-6.html italic-oblique-6.html
== italic-oblique-7.html italic-oblique-7.html
== italic-oblique-8.html italic-oblique-8.html
== italic-oblique-9.html italic-oblique-9.html
== italic-oblique-kinnari.html italic-oblique-kinnari.html
# system font generic per-language tests, only works under OSX currently
# Bug 1212731 - initial implementation caused startup regression and
# regression with full-width digits display in UI elements. Disable
# tests until these problems are corrected.
# random-if(!OSX) == system-generic-fallback-1.html system-generic-fallback-1.html
# random-if(!OSX||OSX<1008) == system-generic-fallback-2.html system-generic-fallback-2.html
# random-if(!OSX||OSX<1008) == system-generic-fallback-3.html system-generic-fallback-3.html
# random-if(!OSX||OSX<1008) == system-generic-fallback-4.html system-generic-fallback-4.html
# random-if(!OSX) == system-generic-fallback-ko.html system-generic-fallback-ko.html
# random-if(!OSX) == system-generic-fallback-zh-tw.html system-generic-fallback-zh-tw.html
# random-if(!OSX) == system-generic-fallback-zh-cn.html system-generic-fallback-zh-cn.html
# random-if(!OSX) == system-generic-fallback-zh-tw.html system-generic-fallback-zh-tw.html

View file

@ -0,0 +1,127 @@
== CSS21-t1502-no-inherited-font-family.xhtml CSS21-t1502-no-inherited-font-family-ref.xhtml
# basic tests for bug 538730
!= synthetic-bold-1.html synthetic-bold-1-ref.html
!= synthetic-bold-2.html synthetic-bold-2-ref.html
# synthetic bold/italic tests
!= defaultfont-bold.html defaultfont.html
!= defaultfont-italic.html defaultfont.html
!= defaultfont-oblique.html defaultfont.html
!= defaultfont-bolditalic.html defaultfont.html
!= defaultfont-bolditalic.html defaultfont-bold.html
!= defaultjapanese-bold.html defaultjapanese.html
!= defaultjapanese-italic.html defaultjapanese.html
!= defaultjapanese-oblique.html defaultjapanese.html
!= defaultjapanese-bolditalic.html defaultjapanese.html
!= defaultjapanese-bolditalic.html defaultjapanese-bold.html
random-if(cocoaWidget) != impact-bold.html impact.html # bug 539418
!= impact-italic.html impact.html
!= impact-oblique.html impact.html
!= impact-bolditalic.html impact.html
!= impact-bolditalic.html impact-bold.html
!= arialunicode-bold.html arialunicode.html
!= arialunicode-italic.html arialunicode.html
!= arialunicode-oblique.html arialunicode.html
!= arialunicode-bolditalic.html arialunicode.html
!= arialunicode-bolditalic.html arialunicode-bold.html
!= lucidaconsole-bold.html lucidaconsole.html
!= lucidaconsole-italic.html lucidaconsole.html
!= lucidaconsole-oblique.html lucidaconsole.html
!= lucidaconsole-bolditalic.html lucidaconsole.html
!= lucidaconsole-bolditalic.html lucidaconsole-bold.html
# checking that we don't match fullnames, psnames (see bug 538103)
== arial-variations-1.html arial-variations-1-ref.html
== arial-variations-2.html arial-variations-2-ref.html
== arial-variations-3.html arial-variations-3-ref.html
== arial-variations-4.html arial-variations-4-ref.html
== arial-variations-5.html arial-variations-5-ref.html
== arial-variations-6.html arial-variations-6-ref.html
# localized font family names should always match just as English names do
== localized-family-names-001.html localized-family-names-001-ref.html
== localized-family-names-002.html localized-family-names-002-ref.html
== localized-family-names-003.html localized-family-names-003-ref.html
== localized-family-names-004.html localized-family-names-004-ref.html
# family names with escaped spaces shouldn't match the names without the spaces
fails-if(http.oscpu=="Linux\u0020x86_64") == familyname-escapedidents.html familyname-escapedidents-ref.html # bug 1309425
# weight mapping tests
HTTP(..) == normalmedium.html normalmedium-ref.html
HTTP(..) != normalmedium.html normalmedium-notref.html
# Linux fails due to bug 604815
fuzzy-if(OSX==1010&&browserIsRemote,1,23) HTTP(..) == weightmapping-12.html weightmapping-12-ref.html
HTTP(..) == weightmapping-25.html weightmapping-25-ref.html
HTTP(..) == weightmapping-45.html weightmapping-45-ref.html
HTTP(..) == weightmapping-458.html weightmapping-458-ref.html
HTTP(..) == weightmapping-478.html weightmapping-478-ref.html
HTTP(..) == weightmapping-7.html weightmapping-7-ref.html
fuzzy-if(OSX==1010,1,30) HTTP(..) == weightmapping-12579.html weightmapping-12579-ref.html
HTTP(..) == stretchmapping-all.html stretchmapping-all-ref.html
HTTP(..) == stretchmapping-reverse.html stretchmapping-reverse-ref.html
fuzzy-if(OSX==1010&&browserIsRemote,1,17) fuzzy-if(Android,4,8) HTTP(..) == stretchmapping-35.html stretchmapping-35-ref.html
fuzzy-if(OSX==1010,3,5) HTTP(..) == stretchmapping-137.html stretchmapping-137-ref.html
# test for font-stretch using @font-face
HTTP(..) == font-stretch-1.html font-stretch-1-ref.html
HTTP(..) == font-shorthand-stretch-1.html font-stretch-1-ref.html
# bug 724231 - applying synthetic styles to a single @font-face font
# should apply artificial obliquing, not switch to a true styled face
!= synthetic-style-1.html synthetic-style-1-notref.html
!= synthetic-style-2.html synthetic-style-2-notref.html
# Bug 765906 - synthetic bold should be used if necessary together with system fallback.
# **NOTE** we skip these on Linux because of bug 769659.
# test 1 uses Cherokee; expected to pass on OS X and Win7
random-if(!(cocoaWidget||/^Windows\x20NT\x206\.1/.test(http.oscpu))) skip-if(gtkWidget) != bold-system-fallback-1.html bold-system-fallback-1-notref.html
# test 2 uses Chess symbols; expected to pass on Android
random-if(!Android) skip-if(gtkWidget) != bold-system-fallback-2.html bold-system-fallback-2-notref.html
# Bug 769475 - applying 'italic' to Arabic text in Arial should NOT change family or metrics.
# Expected to pass on MacOSX and Windows; other platforms unknown, depending on font availability.
random-if(!(cocoaWidget||winWidget)) == arial-arabic.html arial-arabic-ref.html
!= syntheticbold-rotated.html syntheticbold-rotated-ref.html
HTTP(..) == font-synthesis-1.html font-synthesis-1-ref.html
HTTP(..) == font-synthesis-2.html font-synthesis-2-ref.html
# Bug 1060791 - support for format 10 cmap in Apple Symbols;
# relevant fonts not present on other platforms.
skip-if(!cocoaWidget) HTTP(..) != apple-symbols-1.html apple-symbols-1-notref.html
# distinguish between italic and oblique
== simple-oblique.html simple-oblique-ref.html
== italic-oblique-1.html italic-oblique-ref.html
== italic-oblique-2.html italic-oblique-ref.html
== italic-oblique-3.html italic-oblique-ref.html
== italic-oblique-4.html italic-oblique-ref.html
== italic-oblique-5.html italic-oblique-ref.html
== italic-oblique-6.html italic-oblique-ref.html
== italic-oblique-7.html italic-oblique-ref.html
== italic-oblique-8.html italic-oblique-ref.html
== italic-oblique-9.html italic-oblique-ref.html
!= italic-oblique-kinnari.html italic-oblique-kinnari-ref.html
# system font generic per-language tests, only works under OSX currently
# Bug 1212731 - initial implementation caused startup regression and
# regression with full-width digits display in UI elements. Disable
# tests until these problems are corrected.
# random-if(!OSX) == system-generic-fallback-1.html system-generic-fallback-1-ref.html
# random-if(!OSX||OSX<1008) == system-generic-fallback-2.html system-generic-fallback-2-ref.html
# random-if(!OSX||OSX<1008) == system-generic-fallback-3.html system-generic-fallback-3-ref.html
# random-if(!OSX||OSX<1008) == system-generic-fallback-4.html system-generic-fallback-4-ref.html
# random-if(!OSX) != system-generic-fallback-ko.html system-generic-fallback-ja.html
# random-if(!OSX) != system-generic-fallback-zh-tw.html system-generic-fallback-ja.html
# random-if(!OSX) != system-generic-fallback-zh-cn.html system-generic-fallback-ja.html
# random-if(!OSX) != system-generic-fallback-zh-tw.html system-generic-fallback-zh-cn.html

View file

@ -0,0 +1,33 @@
<!DOCTYPE HTML>
<html>
<head>
<title>oblique italic equivalence</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 300%;
}
#sans { font-family: sans-serif; }
#serif { font-family: serif; }
#mono { font-family: monospace; }
p {
margin: 0;
font-style: italic;
line-height: 1.3em;
}
</style>
</head>
<body>
<p id=sans>UNICORN asteroid</p>
<p id=serif>UNICORN asteroid</p>
<p id=mono>UNICORN asteroid</p>
</body>
</html>

View file

@ -0,0 +1,33 @@
<!DOCTYPE HTML>
<html>
<head>
<title>oblique italic equivalence</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-size: 300%;
}
#sans { font-family: sans-serif; }
#serif { font-family: serif; }
#mono { font-family: monospace; }
p {
margin: 0;
font-style: oblique;
line-height: 1.3em;
}
</style>
</head>
<body>
<p id=sans>UNICORN asteroid</p>
<p id=serif>UNICORN asteroid</p>
<p id=mono>UNICORN asteroid</p>
</body>
</html>

View file

@ -0,0 +1,348 @@
<!DOCTYPE HTML>
<html>
<head>
<title>font-stretch mapping tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-family: Verdana, sans-serif;
}
h3, h4 { font-weight: normal; }
table {
border-collapse: collapse;
font-size: 28px;
}
td {
padding: 0; margin: 0;
font-family: test;
}
th {
font-weight: inherit;
}
p { width: 300px; }
.red { color: red; }
thead { font-weight: 400; font-size: 75%; }
/* make all the spans blocks to avoid influence of what's outside them
on line-height calculations */
span { display: block; }
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
font-stretch: ultra-condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-regular.ttf);
font-weight: 400;
font-stretch: ultra-condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
font-stretch: condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-heavy.ttf);
font-weight: 800;
font-stretch: condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
font-stretch: expanded;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
font-stretch: expanded;
}
@font-face {
font-family: test100;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
}
@font-face {
font-family: test200;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: test400;
src: url(../fonts/mplus/mplus-1p-regular.ttf);
font-weight: 400;
}
@font-face {
font-family: test500;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
@font-face {
font-family: test800;
src: url(../fonts/mplus/mplus-1p-heavy.ttf);
font-weight: 800;
}
@font-face {
font-family: test900;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
}
.w1 { font-weight: 100; }
.w2 { font-weight: 200; }
.w3 { font-weight: 300; }
.w4 { font-weight: 400; }
.w5 { font-weight: 500; }
.w6 { font-weight: 600; }
.w7 { font-weight: 700; }
.w8 { font-weight: 800; }
.w9 { font-weight: 900; }
.w1 .fs1 { font-family: test100; }
.w2 .fs1 { font-family: test100; }
.w3 .fs1 { font-family: test100; }
.w4 .fs1 { font-family: test400; }
.w5 .fs1 { font-family: test400; }
.w6 .fs1 { font-family: test400; }
.w7 .fs1 { font-family: test400; }
.w8 .fs1 { font-family: test400; }
.w9 .fs1 { font-family: test400; }
.w1 .fs2 { font-family: test100; }
.w2 .fs2 { font-family: test100; }
.w3 .fs2 { font-family: test100; }
.w4 .fs2 { font-family: test400; }
.w5 .fs2 { font-family: test400; }
.w6 .fs2 { font-family: test400; }
.w7 .fs2 { font-family: test400; }
.w8 .fs2 { font-family: test400; }
.w9 .fs2 { font-family: test400; }
.w1 .fs3 { font-family: test200; }
.w2 .fs3 { font-family: test200; }
.w3 .fs3 { font-family: test200; }
.w4 .fs3 { font-family: test200; }
.w5 .fs3 { font-family: test200; }
.w6 .fs3 { font-family: test800; }
.w7 .fs3 { font-family: test800; }
.w8 .fs3 { font-family: test800; }
.w9 .fs3 { font-family: test800; }
.w1 .fs4 { font-family: test200; }
.w2 .fs4 { font-family: test200; }
.w3 .fs4 { font-family: test200; }
.w4 .fs4 { font-family: test200; }
.w5 .fs4 { font-family: test200; }
.w6 .fs4 { font-family: test800; }
.w7 .fs4 { font-family: test800; }
.w8 .fs4 { font-family: test800; }
.w9 .fs4 { font-family: test800; }
.w1 .fs5 { font-family: test200; }
.w2 .fs5 { font-family: test200; }
.w3 .fs5 { font-family: test200; }
.w4 .fs5 { font-family: test200; }
.w5 .fs5 { font-family: test200; }
.w6 .fs5 { font-family: test800; }
.w7 .fs5 { font-family: test800; }
.w8 .fs5 { font-family: test800; }
.w9 .fs5 { font-family: test800; }
.w1 .fs6 { font-family: test500; }
.w2 .fs6 { font-family: test500; }
.w3 .fs6 { font-family: test500; }
.w4 .fs6 { font-family: test500; }
.w5 .fs6 { font-family: test500; }
.w6 .fs6 { font-family: test900; }
.w7 .fs6 { font-family: test900; }
.w8 .fs6 { font-family: test900; }
.w9 .fs6 { font-family: test900; }
.w1 .fs7 { font-family: test500; }
.w2 .fs7 { font-family: test500; }
.w3 .fs7 { font-family: test500; }
.w4 .fs7 { font-family: test500; }
.w5 .fs7 { font-family: test500; }
.w6 .fs7 { font-family: test900; }
.w7 .fs7 { font-family: test900; }
.w8 .fs7 { font-family: test900; }
.w9 .fs7 { font-family: test900; }
.w1 .fs8 { font-family: test500; }
.w2 .fs8 { font-family: test500; }
.w3 .fs8 { font-family: test500; }
.w4 .fs8 { font-family: test500; }
.w5 .fs8 { font-family: test500; }
.w6 .fs8 { font-family: test900; }
.w7 .fs8 { font-family: test900; }
.w8 .fs8 { font-family: test900; }
.w9 .fs8 { font-family: test900; }
.w1 .fs9 { font-family: test500; }
.w2 .fs9 { font-family: test500; }
.w3 .fs9 { font-family: test500; }
.w4 .fs9 { font-family: test500; }
.w5 .fs9 { font-family: test500; }
.w6 .fs9 { font-family: test900; }
.w7 .fs9 { font-family: test900; }
.w8 .fs9 { font-family: test900; }
.w9 .fs9 { font-family: test900; }
</style>
</head>
<body>
<p>Font family with ultra-condensed 100, 400, condensed 200, 800 and expanded 500, 900</p>
<table>
<thead>
<th></th>
<th class="red">1</th>
<th>2</th>
<th class="red">3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th class="red">7</th>
<th>8</th>
<th>9</th>
</thead>
<tr class="w1">
<th>100</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w2">
<th>200</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w3">
<th>300</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w4">
<th>400</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w5">
<th>500</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w6">
<th>600</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w7">
<th>700</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w8">
<th>800</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w9">
<th>900</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
</table>
</body>
</html>

View file

@ -0,0 +1,268 @@
<!DOCTYPE HTML>
<html>
<head>
<title>font-stretch mapping tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-family: Verdana, sans-serif;
}
h3, h4 { font-weight: normal; }
table {
border-collapse: collapse;
font-size: 28px;
}
td {
padding: 0; margin: 0;
font-family: test;
}
th {
font-weight: inherit;
}
p { width: 300px; }
.red { color: red; }
thead { font-weight: 400; font-size: 75%; }
/* make all the spans blocks to avoid influence of what's outside them
on line-height calculations */
span { display: block; }
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
font-stretch: ultra-condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-regular.ttf);
font-weight: 400;
font-stretch: ultra-condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
font-stretch: condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-heavy.ttf);
font-weight: 800;
font-stretch: condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
font-stretch: expanded;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
font-stretch: expanded;
}
@font-face {
font-family: test100;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
}
@font-face {
font-family: test200;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: test400;
src: url(../fonts/mplus/mplus-1p-regular.ttf);
font-weight: 400;
}
@font-face {
font-family: test500;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
@font-face {
font-family: test800;
src: url(../fonts/mplus/mplus-1p-heavy.ttf);
font-weight: 800;
}
@font-face {
font-family: test900;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
}
.w1 { font-weight: 100; }
.w2 { font-weight: 200; }
.w3 { font-weight: 300; }
.w4 { font-weight: 400; }
.w5 { font-weight: 500; }
.w6 { font-weight: 600; }
.w7 { font-weight: 700; }
.w8 { font-weight: 800; }
.w9 { font-weight: 900; }
.fs1 { font-stretch: ultra-condensed; }
.fs2 { font-stretch: extra-condensed; }
.fs3 { font-stretch: condensed; }
.fs4 { font-stretch: semi-condensed; }
.fs5 { font-stretch: normal; }
.fs6 { font-stretch: semi-expanded; }
.fs7 { font-stretch: expanded; }
.fs8 { font-stretch: extra-expanded; }
.fs9 { font-stretch: ultra-expanded; }
</style>
</head>
<body>
<p>Font family with ultra-condensed 100, 400, condensed 200, 800 and expanded 500, 900</p>
<table>
<thead>
<th></th>
<th class="red">1</th>
<th>2</th>
<th class="red">3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th class="red">7</th>
<th>8</th>
<th>9</th>
</thead>
<tr class="w1">
<th>100</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w2">
<th>200</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w3">
<th>300</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w4">
<th>400</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w5">
<th>500</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w6">
<th>600</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w7">
<th>700</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w8">
<th>800</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
<tr class="w9">
<th>900</th>
<td class="fs1"><span>か</span></td>
<td class="fs2"><span>か</span></td>
<td class="fs3"><span>か</span></td>
<td class="fs4"><span>か</span></td>
<td class="fs5"><span>か</span></td>
<td class="fs6"><span>か</span></td>
<td class="fs7"><span>か</span></td>
<td class="fs8"><span>か</span></td>
<td class="fs9"><span>か</span></td>
</tr>
</table>
</body>
</html>

View file

@ -0,0 +1,320 @@
<!DOCTYPE HTML>
<html>
<head>
<title>font-stretch mapping tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-family: Verdana, sans-serif;
}
h3, h4 { font-weight: normal; }
table {
border-collapse: collapse;
font-size: 28px;
}
td {
padding: 0; margin: 0;
font-family: test;
}
th {
font-weight: inherit;
}
p { width: 300px; }
.red { color: red; }
thead { font-weight: 400; font-size: 75%; }
/* make all the spans blocks to avoid influence of what's outside them
on line-height calculations */
span { display: block; }
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
font-stretch: condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
font-stretch: condensed;
}
@font-face {
font-family: test100;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
}
@font-face {
font-family: test200;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: test500;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
@font-face {
font-family: test900;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
}
.w1 { font-weight: 100; }
.w2 { font-weight: 200; }
.w3 { font-weight: 300; }
.w4 { font-weight: 400; }
.w5 { font-weight: 500; }
.w6 { font-weight: 600; }
.w7 { font-weight: 700; }
.w8 { font-weight: 800; }
.w9 { font-weight: 900; }
.w1 .fs1 { font-family: test100; }
.w2 .fs1 { font-family: test100; }
.w3 .fs1 { font-family: test100; }
.w4 .fs1 { font-family: test100; }
.w5 .fs1 { font-family: test100; }
.w6 .fs1 { font-family: test900; }
.w7 .fs1 { font-family: test900; }
.w8 .fs1 { font-family: test900; }
.w9 .fs1 { font-family: test900; }
.w1 .fs2 { font-family: test100; }
.w2 .fs2 { font-family: test100; }
.w3 .fs2 { font-family: test100; }
.w4 .fs2 { font-family: test100; }
.w5 .fs2 { font-family: test100; }
.w6 .fs2 { font-family: test900; }
.w7 .fs2 { font-family: test900; }
.w8 .fs2 { font-family: test900; }
.w9 .fs2 { font-family: test900; }
.w1 .fs3 { font-family: test100; }
.w2 .fs3 { font-family: test100; }
.w3 .fs3 { font-family: test100; }
.w4 .fs3 { font-family: test100; }
.w5 .fs3 { font-family: test100; }
.w6 .fs3 { font-family: test900; }
.w7 .fs3 { font-family: test900; }
.w8 .fs3 { font-family: test900; }
.w9 .fs3 { font-family: test900; }
.w1 .fs4 { font-family: test100; }
.w2 .fs4 { font-family: test100; }
.w3 .fs4 { font-family: test100; }
.w4 .fs4 { font-family: test100; }
.w5 .fs4 { font-family: test100; }
.w6 .fs4 { font-family: test900; }
.w7 .fs4 { font-family: test900; }
.w8 .fs4 { font-family: test900; }
.w9 .fs4 { font-family: test900; }
.w1 .fs5 { font-family: test200; }
.w2 .fs5 { font-family: test200; }
.w3 .fs5 { font-family: test200; }
.w4 .fs5 { font-family: test500; }
.w5 .fs5 { font-family: test500; }
.w6 .fs5 { font-family: test500; }
.w7 .fs5 { font-family: test500; }
.w8 .fs5 { font-family: test500; }
.w9 .fs5 { font-family: test500; }
.w1 .fs6 { font-family: test200; }
.w2 .fs6 { font-family: test200; }
.w3 .fs6 { font-family: test200; }
.w4 .fs6 { font-family: test500; }
.w5 .fs6 { font-family: test500; }
.w6 .fs6 { font-family: test500; }
.w7 .fs6 { font-family: test500; }
.w8 .fs6 { font-family: test500; }
.w9 .fs6 { font-family: test500; }
.w1 .fs7 { font-family: test200; }
.w2 .fs7 { font-family: test200; }
.w3 .fs7 { font-family: test200; }
.w4 .fs7 { font-family: test500; }
.w5 .fs7 { font-family: test500; }
.w6 .fs7 { font-family: test500; }
.w7 .fs7 { font-family: test500; }
.w8 .fs7 { font-family: test500; }
.w9 .fs7 { font-family: test500; }
.w1 .fs8 { font-family: test200; }
.w2 .fs8 { font-family: test200; }
.w3 .fs8 { font-family: test200; }
.w4 .fs8 { font-family: test500; }
.w5 .fs8 { font-family: test500; }
.w6 .fs8 { font-family: test500; }
.w7 .fs8 { font-family: test500; }
.w8 .fs8 { font-family: test500; }
.w9 .fs8 { font-family: test500; }
.w1 .fs9 { font-family: test200; }
.w2 .fs9 { font-family: test200; }
.w3 .fs9 { font-family: test200; }
.w4 .fs9 { font-family: test500; }
.w5 .fs9 { font-family: test500; }
.w6 .fs9 { font-family: test500; }
.w7 .fs9 { font-family: test500; }
.w8 .fs9 { font-family: test500; }
.w9 .fs9 { font-family: test500; }
</style>
</head>
<body>
<p>Font family with normal width 200, 500 and condensed 100, 900</p>
<table>
<thead>
<th></th>
<th>1</th>
<th>2</th>
<th class="red">3</th>
<th>4</th>
<th class="red">5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
</thead>
<tr class="w1">
<th>100</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w2">
<th>200</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w3">
<th>300</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w4">
<th>400</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w5">
<th>500</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w6">
<th>600</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w7">
<th>700</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w8">
<th>800</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w9">
<th>900</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
</table>
</body>
</html>

View file

@ -0,0 +1,240 @@
<!DOCTYPE HTML>
<html>
<head>
<title>font-stretch mapping tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-family: Verdana, sans-serif;
}
h3, h4 { font-weight: normal; }
table {
border-collapse: collapse;
font-size: 28px;
}
td {
padding: 0; margin: 0;
font-family: test;
}
th {
font-weight: inherit;
}
p { width: 300px; }
.red { color: red; }
thead { font-weight: 400; font-size: 75%; }
/* make all the spans blocks to avoid influence of what's outside them
on line-height calculations */
span { display: block; }
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
font-stretch: condensed;
}
@font-face {
font-family: test;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
font-stretch: condensed;
}
@font-face {
font-family: test100;
src: url(../fonts/mplus/mplus-1p-thin.ttf);
font-weight: 100;
}
@font-face {
font-family: test200;
src: url(../fonts/mplus/mplus-1p-light.ttf);
font-weight: 200;
}
@font-face {
font-family: test500;
src: url(../fonts/mplus/mplus-1p-medium.ttf);
font-weight: 500;
}
@font-face {
font-family: test900;
src: url(../fonts/mplus/mplus-1p-black.ttf);
font-weight: 900;
}
.w1 { font-weight: 100; }
.w2 { font-weight: 200; }
.w3 { font-weight: 300; }
.w4 { font-weight: 400; }
.w5 { font-weight: 500; }
.w6 { font-weight: 600; }
.w7 { font-weight: 700; }
.w8 { font-weight: 800; }
.w9 { font-weight: 900; }
.fs1 { font-stretch: ultra-condensed; }
.fs2 { font-stretch: extra-condensed; }
.fs3 { font-stretch: condensed; }
.fs4 { font-stretch: semi-condensed; }
.fs5 { font-stretch: normal; }
.fs6 { font-stretch: semi-expanded; }
.fs7 { font-stretch: expanded; }
.fs8 { font-stretch: extra-expanded; }
.fs9 { font-stretch: ultra-expanded; }
</style>
</head>
<body>
<p>Font family with normal width 200, 500 and condensed 100, 900</p>
<table>
<thead>
<th></th>
<th>1</th>
<th>2</th>
<th class="red">3</th>
<th>4</th>
<th class="red">5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
</thead>
<tr class="w1">
<th>100</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w2">
<th>200</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w3">
<th>300</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w4">
<th>400</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w5">
<th>500</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w6">
<th>600</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w7">
<th>700</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w8">
<th>800</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
<tr class="w9">
<th>900</th>
<td class="fs1"><span>あ</span></td>
<td class="fs2"><span>あ</span></td>
<td class="fs3"><span>あ</span></td>
<td class="fs4"><span>あ</span></td>
<td class="fs5"><span>あ</span></td>
<td class="fs6"><span>あ</span></td>
<td class="fs7"><span>あ</span></td>
<td class="fs8"><span>あ</span></td>
<td class="fs9"><span>あ</span></td>
</tr>
</table>
</body>
</html>

View file

@ -0,0 +1,366 @@
<!DOCTYPE HTML>
<html>
<head>
<title>font-stretch matching tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-family: Calibri, Verdana, sans-serif;
}
p { margin: 0; padding: 0; }
table {
border-collapse: collapse;
}
th {
font-weight: normal;
background-color: #eee;
}
th, td { width: 3em; text-align: left; }
tr th { text-align: left; }
.fstest-full { font-family: fstest-full; }
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd2.ttf);
font-stretch: extra-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd3.ttf);
font-stretch: condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd5.ttf);
font-stretch: normal;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd8.ttf);
font-stretch: extra-expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd9.ttf);
font-stretch: ultra-expanded;
}
.fstest-1-3 { font-family: fstest-1-3; }
@font-face {
font-family: fstest-1-3;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-1-3;
src: url(../fonts/csstest-widths-wd3.ttf);
font-stretch: condensed;
}
.fstest-1-4 { font-family: fstest-1-4; }
@font-face {
font-family: fstest-1-4;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-1-4;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
.fstest-1-5 { font-family: fstest-1-5; }
@font-face {
font-family: fstest-1-5;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-1-5;
src: url(../fonts/csstest-widths-wd5.ttf);
font-stretch: normal;
}
.fstest-2-6 { font-family: fstest-2-6; }
@font-face {
font-family: fstest-2-6;
src: url(../fonts/csstest-widths-wd2.ttf);
font-stretch: extra-condensed;
}
@font-face {
font-family: fstest-2-6;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
.fstest-4-6 { font-family: fstest-4-6; }
@font-face {
font-family: fstest-4-6;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
@font-face {
font-family: fstest-4-6;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
.fstest-4-7 { font-family: fstest-4-7; }
@font-face {
font-family: fstest-4-7;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
@font-face {
font-family: fstest-4-7;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
.fstest-6-7 { font-family: fstest-6-7; }
@font-face {
font-family: fstest-6-7;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
@font-face {
font-family: fstest-6-7;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
.fstest-7-9 { font-family: fstest-7-9; }
@font-face {
font-family: fstest-7-9;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
@font-face {
font-family: fstest-7-9;
src: url(../fonts/csstest-widths-wd9.ttf);
font-stretch: ultra-expanded;
}
.fstest-8-9 { font-family: fstest-8-9; }
@font-face {
font-family: fstest-8-9;
src: url(../fonts/csstest-widths-wd8.ttf);
font-stretch: extra-expanded;
}
@font-face {
font-family: fstest-8-9;
src: url(../fonts/csstest-widths-wd9.ttf);
font-stretch: ultra-expanded;
}
.fs1 { font-stretch: ultra-condensed; }
.fs2 { font-stretch: extra-condensed; }
.fs3 { font-stretch: condensed; }
.fs4 { font-stretch: semi-condensed; }
.fs5 { font-stretch: normal; }
.fs6 { font-stretch: semi-expanded; }
.fs7 { font-stretch: expanded; }
.fs8 { font-stretch: extra-expanded; }
.fs9 { font-stretch: ultra-expanded; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p>font-stretch mapping with different font family sets</p>
<p>(only numbers should appear in the body of the table)</p>
<table>
<thead>
<th>width</th>
<th>full</th>
<th>1-3</th>
<th>1-4</th>
<th>1-5</th>
<th>2-6</th>
<th>4-6</th>
<th>4-7</th>
<th>6-7</th>
<th>7-9</th>
<th>8-9</th>
</thead>
<tr class="fs1">
<th>1</th>
<td class="fstest-full">1</td>
<td class="fstest-1-3">1</td>
<td class="fstest-1-4">1</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs2">
<th>2</th>
<td class="fstest-full">2</td>
<td class="fstest-1-3">1</td>
<td class="fstest-1-4">1</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs3">
<th>3</th>
<td class="fstest-full">3</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">1</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs4">
<th>4</th>
<td class="fstest-full">4</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs5">
<th>5</th>
<td class="fstest-full">5</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs6">
<th>6</th>
<td class="fstest-full">6</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs7">
<th>7</th>
<td class="fstest-full">7</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">7</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs8">
<th>8</th>
<td class="fstest-full">8</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">7</td>
<td class="fstest-7-9">9</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs9">
<th>9</th>
<td class="fstest-full">9</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">7</td>
<td class="fstest-7-9">9</td>
<td class="fstest-8-9">9</td>
</tr>
</table>
</body>
</html>

View file

@ -0,0 +1,505 @@
<!DOCTYPE HTML>
<html>
<head>
<title>font-stretch matching tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
margin: 50px;
font-family: Calibri, Verdana, sans-serif;
}
p { margin: 0; padding: 0; }
table {
border-collapse: collapse;
}
th {
font-weight: normal;
background-color: #eee;
}
th, td { width: 3em; text-align: left; }
tr th { text-align: left; }
.fstest-full { font-family: fstest-full; }
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd2.ttf);
font-stretch: extra-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd3.ttf);
font-stretch: condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd5.ttf);
font-stretch: normal;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd8.ttf);
font-stretch: extra-expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd9.ttf);
font-stretch: ultra-expanded;
}
.fstest-1-3 { font-family: fstest-1-3; }
@font-face {
font-family: fstest-1-3;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-1-3;
src: url(../fonts/csstest-widths-wd3.ttf);
font-stretch: condensed;
}
.fstest-1-4 { font-family: fstest-1-4; }
@font-face {
font-family: fstest-1-4;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-1-4;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
.fstest-1-5 { font-family: fstest-1-5; }
@font-face {
font-family: fstest-1-5;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-1-5;
src: url(../fonts/csstest-widths-wd5.ttf);
font-stretch: normal;
}
.fstest-2-6 { font-family: fstest-2-6; }
@font-face {
font-family: fstest-2-6;
src: url(../fonts/csstest-widths-wd2.ttf);
font-stretch: extra-condensed;
}
@font-face {
font-family: fstest-2-6;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
.fstest-4-6 { font-family: fstest-4-6; }
@font-face {
font-family: fstest-4-6;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
@font-face {
font-family: fstest-4-6;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
.fstest-4-7 { font-family: fstest-4-7; }
@font-face {
font-family: fstest-4-7;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-condensed;
}
@font-face {
font-family: fstest-4-7;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
.fstest-6-7 { font-family: fstest-6-7; }
@font-face {
font-family: fstest-6-7;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-expanded;
}
@font-face {
font-family: fstest-6-7;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
.fstest-7-9 { font-family: fstest-7-9; }
@font-face {
font-family: fstest-7-9;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: expanded;
}
@font-face {
font-family: fstest-7-9;
src: url(../fonts/csstest-widths-wd9.ttf);
font-stretch: ultra-expanded;
}
.fstest-8-9 { font-family: fstest-8-9; }
@font-face {
font-family: fstest-8-9;
src: url(../fonts/csstest-widths-wd8.ttf);
font-stretch: extra-expanded;
}
@font-face {
font-family: fstest-8-9;
src: url(../fonts/csstest-widths-wd9.ttf);
font-stretch: ultra-expanded;
}
.fs1 { font-stretch: ultra-condensed; }
.fs2 { font-stretch: extra-condensed; }
.fs3 { font-stretch: condensed; }
.fs4 { font-stretch: semi-condensed; }
.fs5 { font-stretch: normal; }
.fs6 { font-stretch: semi-expanded; }
.fs7 { font-stretch: expanded; }
.fs8 { font-stretch: extra-expanded; }
.fs9 { font-stretch: ultra-expanded; }
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p>font-stretch mapping with different font family sets</p>
<p>(only numbers should appear in the body of the table)</p>
<table>
<thead>
<th>width</th>
<th>full</th>
<th>1-3</th>
<th>1-4</th>
<th>1-5</th>
<th>2-6</th>
<th>4-6</th>
<th>4-7</th>
<th>6-7</th>
<th>7-9</th>
<th>8-9</th>
</thead>
<tr class="fs1">
<th>1</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs2">
<th>2</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs3">
<th>3</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs4">
<th>4</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs5">
<th>5</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs6">
<th>6</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs7">
<th>7</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs8">
<th>8</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
<tr class="fs9">
<th>9</th>
<td class="fstest-full">F</td>
<td class="fstest-1-3">F</td>
<td class="fstest-1-4">F</td>
<td class="fstest-1-5">F</td>
<td class="fstest-2-6">F</td>
<td class="fstest-4-6">F</td>
<td class="fstest-4-7">F</td>
<td class="fstest-6-7">F</td>
<td class="fstest-7-9">F</td>
<td class="fstest-8-9">F</td>
</tr>
</table>
<!--
<p>Results based on spec logic:</p>
<table>
<thead>
<th>width</th>
<th>full</th>
<th>1-3</th>
<th>1-4</th>
<th>1-5</th>
<th>2-6</th>
<th>4-6</th>
<th>4-7</th>
<th>6-7</th>
<th>7-9</th>
<th>8-9</th>
</thead>
<tr class="fs1">
<th>1</th>
<td class="fstest-full">1</td>
<td class="fstest-1-3">1</td>
<td class="fstest-1-4">1</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs2">
<th>2</th>
<td class="fstest-full">2</td>
<td class="fstest-1-3">1</td>
<td class="fstest-1-4">1</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs3">
<th>3</th>
<td class="fstest-full">3</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">1</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs4">
<th>4</th>
<td class="fstest-full">4</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">1</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs5">
<th>5</th>
<td class="fstest-full">5</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">2</td>
<td class="fstest-4-6">4</td>
<td class="fstest-4-7">4</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs6">
<th>6</th>
<td class="fstest-full">6</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">6</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs7">
<th>7</th>
<td class="fstest-full">7</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">7</td>
<td class="fstest-7-9">7</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs8">
<th>8</th>
<td class="fstest-full">8</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">7</td>
<td class="fstest-7-9">9</td>
<td class="fstest-8-9">8</td>
</tr>
<tr class="fs9">
<th>9</th>
<td class="fstest-full">9</td>
<td class="fstest-1-3">3</td>
<td class="fstest-1-4">4</td>
<td class="fstest-1-5">5</td>
<td class="fstest-2-6">6</td>
<td class="fstest-4-6">6</td>
<td class="fstest-4-7">7</td>
<td class="fstest-6-7">7</td>
<td class="fstest-7-9">9</td>
<td class="fstest-8-9">9</td>
</tr>
</table>
-->
</body>
</html>

View file

@ -0,0 +1,54 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Assure OS/2 usWidthClass isn't referenced</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd5.ttf);
font-stretch: normal;
}
body {
margin: 50px;
}
p.test {
font-family: fstest-full;
font-size: 24px;
}
.fs9 { font-stretch: ultra-condensed; }
.fs8 { font-stretch: extra-condensed; }
.fs7 { font-stretch: condensed; }
.fs6 { font-stretch: semi-condensed; }
.fs5 { font-stretch: normal; }
.fs4 { font-stretch: semi-expanded; }
.fs3 { font-stretch: expanded; }
.fs2 { font-stretch: extra-expanded; }
.fs1 { font-stretch: ultra-expanded; }
</style>
</head>
<body>
<p>The numbers below should appear in ascending sequence:</p>
<p class="test">
<span class="fs1">1</span>
<span class="fs2">2</span>
<span class="fs3">3</span>
<span class="fs4">4</span>
<span class="fs5">5</span>
<span class="fs6">6</span>
<span class="fs7">7</span>
<span class="fs8">8</span>
<span class="fs9">9</span>
</p>
</body>
</html>

View file

@ -0,0 +1,102 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Assure OS/2 usWidthClass isn't referenced</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd9.ttf);
font-stretch: ultra-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd8.ttf);
font-stretch: extra-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd7.ttf);
font-stretch: condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd6.ttf);
font-stretch: semi-condensed;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd5.ttf);
font-stretch: normal;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd4.ttf);
font-stretch: semi-expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd3.ttf);
font-stretch: expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd2.ttf);
font-stretch: extra-expanded;
}
@font-face {
font-family: fstest-full;
src: url(../fonts/csstest-widths-wd1.ttf);
font-stretch: ultra-expanded;
}
body {
margin: 50px;
}
p.test {
font-family: fstest-full;
font-size: 24px;
}
.fs9 { font-stretch: ultra-condensed; }
.fs8 { font-stretch: extra-condensed; }
.fs7 { font-stretch: condensed; }
.fs6 { font-stretch: semi-condensed; }
.fs5 { font-stretch: normal; }
.fs4 { font-stretch: semi-expanded; }
.fs3 { font-stretch: expanded; }
.fs2 { font-stretch: extra-expanded; }
.fs1 { font-stretch: ultra-expanded; }
</style>
</head>
<body>
<p>The numbers below should appear in ascending sequence:</p>
<p class="test">
<span class="fs1">F</span>
<span class="fs2">F</span>
<span class="fs3">F</span>
<span class="fs4">F</span>
<span class="fs5">F</span>
<span class="fs6">F</span>
<span class="fs7">F</span>
<span class="fs8">F</span>
<span class="fs9">F</span>
</p>
</body>
</html>

View file

@ -0,0 +1,11 @@
<html>
<head>
<style type="text/css">
body { font-family: Symbol, OpenSymbol, "Standard Symbols L"; font-size: 2em; }
</style>
</head>
<body>
<p>&#xf061;&#xf062;&#xf063; abc</p>
<p>&#xf061;&#xf062;&#xf063; abc</p>
</body>
</html>

View file

@ -0,0 +1,12 @@
<html>
<head>
<style type="text/css">
body { font-family: Symbol, OpenSymbol, "Standard Symbols L"; font-size: 2em; }
</style>
</head>
<!-- if synthetic bolding is working, this should NOT match the reference -->
<body>
<p>&#xf061;&#xf062;&#xf063; abc</p>
<p><b>&#xf061;&#xf062;&#xf063; abc</b></p>
</body>
</html>

View file

@ -0,0 +1,11 @@
<html>
<head>
<style type="text/css">
body { font-family: "Apple Chancery", Impact, "Microsoft Sans Serif", "URW Chancery L"; font-size: 2em; }
</style>
</head>
<body>
<p>Hello World</p>
<p>Hello World</p>
</body>
</html>

View file

@ -0,0 +1,12 @@
<html>
<head>
<style type="text/css">
body { font-family: "Apple Chancery", Impact, "Microsoft Sans Serif", "URW Chancery L"; font-size: 2em; }
</style>
</head>
<!-- if synthetic bolding is working, this should NOT match the reference -->
<body>
<p>Hello World</p>
<p><b>Hello World</b></p>
</body>
</html>

View file

@ -0,0 +1,15 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Synthetic italic should not use true italic face</title>
<!-- see bug 724231 -->
<style type="text/css">
body {
font-family: "Times New Roman", "Times", "DejaVu Serif", "FreeSerif", "Droid Serif", sans-serif;
}
</style>
</head>
<body>
<p><i>Synthetic italics</i> should <i>not</i> use the true italic face.
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Synthetic italic should not use true italic face</title>
<!-- see bug 724231 -->
<style type="text/css">
@font-face {
font-family: test;
src: local(Times New Roman), local(Times), local(DejaVu Serif), local(FreeSerif), local(Droid Serif);
}
body {
font-family: test, sans-serif;
}
</style>
</head>
<body>
<p><i>Synthetic italics</i> should <i>not</i> use the true italic face.
</body>
</html>

View file

@ -0,0 +1,15 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Synthetic bold should not use true bold face</title>
<!-- see bug 724231 -->
<style type="text/css">
body {
font-family: "Times New Roman", "Times", "DejaVu Serif", "FreeSerif", "Droid Serif", sans-serif;
}
</style>
</head>
<body>
<p><b>Synthetic bold</b> should <b>not</b> use the true bold face.
</body>
</html>

View file

@ -0,0 +1,19 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Synthetic bold should not use true bold face</title>
<!-- see bug 724231 -->
<style type="text/css">
@font-face {
font-family: test;
src: local(Times New Roman), local(Times), local(DejaVu Serif), local(FreeSerif), local(Droid Serif);
}
body {
font-family: test, sans-serif;
}
</style>
</head>
<body>
<p><b>Synthetic bold</b> should <b>not</b> use the true bold face.
</body>
</html>

View file

@ -0,0 +1,35 @@
<!DOCTYPE HTML>
<html>
<head>
<title>rotated synthetic bold</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@font-face {
font-family: libertine;
src: url(../fonts/LinLibertine_Re-4.7.5.woff);
}
body {
margin: 150px 0px;
font-size: 800%;
}
p { margin: 0; }
.test {
font-family: libertine;
display: inline-block;
transform: rotate(90deg);
}
</style>
</head>
<body>
<p><span class="test">uh oh!</span></p>
</body>
</html>

Some files were not shown because too many files have changed in this diff Show more