-
Notifications
You must be signed in to change notification settings - Fork 1.2k
/
CustomFont.html
108 lines (106 loc) · 6.23 KB
/
CustomFont.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<h1>Fonts</h1>
<p>A font can either be specified directly via its face or via CSS styles. In CSS the font is never specified directly but instead via the font-family and various attributes.</p>
<h2 style="color:red">Standard Fonts</h2>
<p>The Standard font family to be used is 'Times New Roman', 12 px.</p>
<p>These are the fonts where all 4 basic faces are available: Regular, Bold, Italic and Bold/Italic.</p>
<h3>Arial</h3>
<ul>
<li>Regular:<br /><font size="5" face="ArialMT">ArialMT</font></li>
<li>Bold:<br /><font size="5" face="Arial-BoldMT">Arial-BoldMT</font></li>
<li>Italic:<br /><font size="5" face="Arial-ItalicMT">Arial-ItalicMT</font></li>
<li>Bold/Italic:<br /><font size="5" face="Arial-BoldItalicMT">Arial-BoldItalicMT</font></li>
</ul>
<h3>Baskerville</h3>
<ul>
<li>Regular:<br /><font size="5" face="Baskerville">Baskerville</font></li>
<li>Bold:<br /><font size="5" face="Baskerville-SemiBold">Baskerville-SemiBold</font></li>
<li>Italic:<br /><font size="5" face="Baskerville-Italic">Baskerville-Italic</font></li>
<li>Bold/Italic:<br /><font size="5" face="Baskerville-SemiBoldItalic">Baskerville-SemiBoldItalic</font></li>
</ul>
<h3>Cochin</h3>
<ul>
<li>Regular:<br /><font size="5" face="Cochin">Cochin</font></li>
<li>Bold:<br /><font size="5" face="Cochin-Bold">Cochin-Bold</font></li>
<li>Italic:<br /><font size="5" face="Cochin-Italic">Cochin-Italic</font></li>
<li>Bold/Italic:<br /><font size="5" face="Cochin-BoldItalic">Cochin-BoldItalic</font></li>
</ul>
<h3>Courier</h3>
<ul>
<li>Regular:<br /><font size="5" face="Courier">Courier</font></li>
<li>Bold:<br /><font size="5" face="Courier-Bold">Courier-Bold</font></li>
<li>Italic:<br /><font size="5" face="Courier-Oblique">Courier-Oblique</font></li>
<li>Bold/Italic:<br /><font size="5" face="Courier-BoldOblique">Courier-BoldOblique</font></li>
</ul>
<h3>Courier New</h3>
<ul>
<li>Regular:<br /><font size="5" face="CourierNewPSMT">CourierNewPSMT</font></li>
<li>Bold:<br /><font size="5" face="CourierNewPS-BoldMT">CourierNewPS-BoldMT</font></li>
<li>Italic:<br /><font size="5" face="CourierNewPS-ItalicMT">CourierNewPS-ItalicMT</font></li>
<li>Bold/Italic:<br /><font size="5" face="CourierNewPS-BoldItalicMT">CourierNewPS-BoldItalicMT</font></li>
</ul>
<h3>Georgia</h3>
<ul>
<li>Regular:<br /><font size="5" face="Georgia">Georgia</font></li>
<li>Bold:<br /><font size="5" face="Georgia-Bold">Georgia-Bold</font></li>
<li>Italic:<br /><font size="5" face="Georgia-Italic">Georgia-Italic</font></li>
<li>Bold/Italic:<br /><font size="5" face="Georgia-BoldItalic">Georgia-BoldItalic</font></li>
</ul>
<h3>Helvetica</h3>
<ul>
<li>Regular:<br /><font size="5" face="Helvetica">Helvetica</font></li>
<li>Bold:<br /><font size="5" face="Helvetica-Bold">Helvetica-Bold</font></li>
<li>Italic:<br /><font size="5" face="Helvetica-Oblique">Helvetica-Oblique</font></li>
<li>Bold/Italic:<br /><font size="5" face="Helvetica-BoldOblique">Helvetica-BoldOblique</font></li>
</ul>
<h3>Helvetica Neue</h3>
<ul>
<li>Regular:<br /><font size="5" face="HelveticaNeue">HelveticaNeue</font></li>
<li>Bold:<br /><font size="5" face="HelveticaNeue-Bold">HelveticaNeue-Bold</font></li>
<li>Italic:<br /><font size="5" face="HelveticaNeue-Italic">HelveticaNeue-Italic</font></li>
<li>Bold/Italic:<br /><font size="5" face="HelveticaNeue-BoldItalic">HelveticaNeue-BoldItalic</font></li>
</ul>
<h3>Palatino</h3>
<ul>
<li>Regular:<br /><font size="5" face="Palatino-Roman">Palatino-Roman</font></li>
<li>Bold:<br /><font size="5" face="Palatino-Bold">Palatino-Bold</font></li>
<li>Italic:<br /><font size="5" face="Palatino-Italic">Palatino-Italic</font></li>
<li>Bold/Italic:<br /><font size="5" face="Palatino-BoldItalic">Palatino-BoldItalic</font></li>
</ul>
<h3>Times New Roman</h3>
<ul>
<li>Regular:<br /><font size="5" face="TimesNewRomanPSMT">TimesNewRomanPSMT</font></li>
<li>Bold:<br /><font size="5" face="TimesNewRomanPS-BoldMT">TimesNewRomanPS-BoldMT</font></li>
<li>Italic:<br /><font size="5" face="TimesNewRomanPS-ItalicMT">TimesNewRomanPS-ItalicMT</font></li>
<li>Bold/Italic:<br /><font size="5" face="TimesNewRomanPS-BoldItalicMT">TimesNewRomanPS-BoldItalicMT</font></li>
</ul>
<h3>Trebuchet MS</h3>
<ul>
<li>Regular:<br /><font size="5" face="TrebuchetMS">TrebuchetMS</font></li>
<li>Bold:<br /><font size="5" face="TrebuchetMS-Bold">TrebuchetMS-Bold</font></li>
<li>Italic:<br /><font size="5" face="TrebuchetMS-Italic">TrebuchetMS-Italic</font></li>
<li>Bold/Italic:<br /><font size="5" face="Trebuchet-BoldItalic">Trebuchet-BoldItalic</font></li>
</ul>
<h3>Verdana</h3>
<ul>
<li>Regular:<br /><font size="5" face="Verdana">Verdana</font></li>
<li>Bold:<br /><font size="5" face="Verdana-Bold">Verdana-Bold</font></li>
<li>Italic:<br /><font size="5" face="Verdana-Italic">Verdana-Italic</font></li>
<li>Bold/Italic:<br /><font size="5" face="Verdana-BoldItalic">Verdana-BoldItalic</font></li>
</ul>
<hr />
<h2 style="color:red">Custom Fonts</h2>
<p>Usage of custom fonts is supported. You have to register these in the info.plist.</p>
<p>Note: For some fonts you might have to bundle the normal as well as the bold variant for CTFontDescriptor to find the normal font.</p>
<p>Core Text automatically display Right-to-Left Text as such if only RTL characters are used
<p>XB Niloofar:</p>
<p dir="rtl" style="font-weight:normal;font-family:'XB Niloofar';font-size:24px">بِسْمِ اللّٰهِ</p>
<p>American Typewriter:</p>
<right><p style="font-family:'American Typewriter';font-size:20px">AmericanTypewriter</p></right>
<p>American Typewriter Bold:</p>
<right><p style="font-weight:bold;font-family:'American Typewriter';font-size:20px">AmericanTypewriter</p></right>
<hr />
<h2 style="color:red">Font Variants</h2>
<p>The font variant 'Small Caps' is supported by synthesizing an attributed string that has the lower case characters in the same font as the upper case ones, but 30% smaller.</p>
<p>Helvetica (synthesized):<br/><span style="font-family:'Helvetica';font-size:30px;font-variant:small-caps">The Quick Brown <b>Fox</b> Jumps ...</span></p>
<p>HoeflerText (native, iPad only):<br/><span style="font-family:'Hoefler Text';font-size:30px;font-variant:small-caps">The Quick Brown <b>Fox</b> Jumps ...</span></p><p>Supported values for the style font-variant:</p>
<ul><li>inherit</li><li>normal</li><li>small-caps</li></ul>