|
|
| 643. rida: |
643. rida: |
|
| |
|
| ==Fontide näidised== | | ==Fontide näidised== |
|
| |
|
| |
| *<span style="text-align:right";> Font: Old English Text, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="font-family: Old English Text; font-size: 16px"> Font: Old English Text, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="font-family: Old English Text; font-size: 16px"> Font: Old English Text, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="font-family: Ink Free; font-size:16px;"> Font: Ink Free, 18px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="background:white; color:black; font-family: Ink Free; font-size:100%;"> Font: Ink Free |The Quick Brown Fox Jumps Over The Lazy Dog.| Regular,| '''Bold''',| ''Italic'',| '''''Bold Italic'''''|</span>
| |
| *<span style="background:white; color:black; font-family: Old English Text; font-size: 16px"> Font: Old English Text, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="background:white; color:black; font-family: Ink Free; font-size:16px;"> Font: Ink Free, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="background:white; color:red; font-family: Comic Sans MS; font-size:16px;">Font: Comic Sans MS, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="background:white; color:red; font-family: Helvetica, sans-serif; font-size:16px;">Font: Helvetica, sans-serif, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="background:white; color:red; font-family: Arial, Helvetica, sans-serif; font-size:16px;">Font: Arial, Helvetica, sans-serif, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="background:white; color:red; font-family: Arial, Helvetica, sans-serif; font-size:16px;">Font: Arial, Helvetica, sans-serif, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="font-family: Times, serif; font-size: 16px;"
| |
| *<span style="font-family: Times New Roman, Times, serif;">Times New Roman</span>
| |
| *<span style="font-family: Courier, monospace; font-size: 16px;"
| |
| *<span style="font-family: Courier New, Courier, monospace;">Courier New</span>
| |
| *<span style="font-family: Tahoma, sans-serif; font-size: 16px;"
| |
| *<span style="font-family: 'Lucida Sans Unicode', sans-serif; font-size: 16px;"
| |
| *<span style="font-family: 'Lucida Console', monospace; font-size: 16px;"
| |
| *<span style="font-family: 'Microsoft Sans Serif', sans-serif; font-size: 16px;"
| |
| *<span style="font-family: 'Palatino Linotype', serif; font-size: 16px;"
| |
| *<span style="font-family: 'Franklin Gothic Medium', sans-serif; font-size: 16px;"
| |
| *<span style="font-family: 'Segoe UI', sans-serif; font-size: 16px;"
| |
| *<span style="font-family: Calibri, sans-serif; font-size: 16px;"
| |
| *<span style="font-family: Candara, sans-serif; font-size: 16px;"
| |
| *<span style="font-family: Consolas, monospace; font-size: 16px;"
| |
| *<span style="font-family: Constantia, serif; font-size: 16px;"
| |
| *<span style="font-family: Corbel, sans-serif; font-size: 16px;"
| |
| *<span style="font-family: Arial;">Arial</span>; the base font,
| |
| *<span style="font-family: 'Comic Sans MS';">Comic Sans MS</span>,
| |
| *<span style="font-family: Georgia;">Georgia</span>,
| |
| *<span style="font-family: 'Trebuchet MS';">Trebuchet MS</span>
| |
| *<span style="font-family: Verdana;">Verdana</span>
| |
| *<span style="font-family: 'Courier New';">Courier New</span>
| |
| *<span style="font-family: 'Courier New', monospace; font-size: 16px;"
| |
| *<span style="font-family: 'Comic Sans MS', cursive; font-size: 16px;"
| |
| *<span style="font-family: Georgia, serif; font-size: 16px;"
| |
| *<span style="font-family: 'Trebuchet MS', sans-serif; font-size: 16px;"
| |
| *<span style="font-family: Verdana, sans-serif; font-size: 16px;"
| |
| *<span style="font-family: Arial Black, sans-serif; font-size: 24px;"
| |
| *<span style="font-family: Impact, sans-serif; font-size: 24px;"
| |
| *<span style="background:white; color:black; font-family: Old English Text; font-size:100%;">
| |
| *<span style="background:white; color:black; font-family: Ink Free; font-size:120%;">
| |
| *<span style="background:white; color:red; font-family: Comic Sans MS; font-size:100%;">
| |
| *<span style="background:white; color:black; font-family: Ink Free; font-size:100%;""
| |
| *<span style="font-family: Helvetica, sans-serif; font-size: 16px;"
| |
| *<span style="font-family: Arial, Helvetica, sans-serif;">Arial</span>
| |
| *<span style="font-family: Times, serif; font-size: 16px;"
| |
| *<span style="font-family: Courier, monospace; font-size: 16px;"
| |
| *<span style="font-family: Courier New, Courier, monospace;">Courier New</span>
| |
| *<span style="font-family: Arial;">Arial</span>; the base font,
| |
| *<span style="font-family: 'Comic Sans MS';">Comic Sans MS</span>,
| |
| *<span style="font-family: Georgia;">Georgia</span>,
| |
| *<span style="font-family: 'Trebuchet MS';">Trebuchet MS</span>
| |
| *<span style="font-family: Verdana;">Verdana</span>
| |
| *<span style="font-family: 'Times New Roman';">Times New Roman</span>
| |
| *<span style="font-family: 'Courier New';">Courier New</span>
| |
| *<span style="font-family:Andale Mono">Andalé Mono</span>
| |
| *<span style="font-family:"Lucida Console">Lucida Console</span>
| |
| *<span style="font-family: "Comic Sans MS", Chalkboard SE, cursive, sans-serif;</span>
| |
| *<span style="font-family: Arial;">Arial</span> as the base font,
| |
| *<span style="font-family: 'Comic Sans MS';">Comic Sans MS</span>,
| |
| *<span style="font-family: Georgia;">Georgia</span>,
| |
| *<span style="font-family: 'Trebuchet MS';">Trebuchet MS</span> and
| |
| *<span style="font-family: Verdana;">Verdana</span> are safe to use inline.
| |
| *<span style="font-family: 'Times New Roman';">Times New Roman</span>
| |
| *<span style="font-family: 'Courier New';">Courier New</span> has a lower height, it remains legible, and is the de facto monospace font.
| |
| *<span style="font-family: Arial Black, sans-serif; font-size: 24px;"
| |
| *<span style="font-family: Impact, sans-serif; font-size: 24px;"
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| [[Õhne veejõud 2]]
| |
|
| |
| *<span style="background:white; color:black; font-family: Old English Text; font-size: 16px"> Font: Old English Text, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
| *<span style="background:white; color:black; font-family: Ink Free; font-size:16px;"> Font: Ink Free, 18px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
|
| |
|
| |
| [[Õhne jõgi]]
| |
|
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Näidis
| |
| ! Variandid
| |
|
| |
| *<span style="background:white; color:black; font-family: Old English Text; font-size:16px;"> Font: Old English Text|The Quick Brown Fox Jumps Over The Lazy Dog.| Regular,| '''Bold''',| ''Italic'',| '''''Bold Italic'''''|</span>
| |
|
| |
| *<span style="background:white; color:black; font-family: Ink Free; font-size:100%;"> Font: Ink Free |The Quick Brown Fox Jumps Over The Lazy Dog.| Regular,| '''Bold''',| ''Italic'',| '''''Bold Italic'''''|</span>
| |
|
| |
| --------------------------------------------------------------------------------------------------
| |
|
| |
| *<span style="background:white; color:black; font-family: Old English Text; font-size: 16px"> Font: Old English Text, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
|
| |
| *<span style="background:white; color:black; font-family: Ink Free; font-size:16px;"> Font: Ink Free, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
|
| |
| *<span style="background:white; color:red; font-family: Comic Sans MS; font-size:16px;">Font: Comic Sans MS, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
|
| |
| *<span style="background:white; color:red; font-family: Helvetica, sans-serif; font-size:16px;">Font: Helvetica, sans-serif, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
|
| |
| *<span style="background:white; color:red; font-family: Arial, Helvetica, sans-serif; font-size:16px;">Font: Arial, Helvetica, sans-serif, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
|
| |
| *<span style="background:white; color:red; font-family: Arial, Helvetica, sans-serif; font-size:16px;">Font: Arial, Helvetica, sans-serif, 16px | The Quick Brown Fox Jumps Over The Lazy Dog. Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''</span>
| |
|
| |
|
| |
| |- style="font-family: Times, serif; font-size: 16px;"
| |
|
| |
| |<span style="font-family: Times New Roman, Times, serif;">Times New Roman</span>
| |
| |- style="font-family: Courier, monospace; font-size: 16px;"
| |
| '
| |
| |<span style="font-family: Courier New, Courier, monospace;">Courier New</span>
| |
| |}
| |
|
| |
| ===Common Windows fonts===
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Since
| |
| ! Sample
| |
| ! Variants
| |
| |- style="font-family: Tahoma, sans-serif; font-size: 16px;"
| |
| | [[Tahoma (typeface)|Tahoma]]
| |
| | Windows 98
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold'''
| |
| |- style="font-family: 'Lucida Sans Unicode', sans-serif; font-size: 16px;"
| |
| | [[Lucida Sans Unicode]]
| |
| | Windows 98
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |- style="font-family: 'Lucida Console', monospace; font-size: 16px;"
| |
| | [[Lucida Console]]
| |
| | Windows 98
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |- style="font-family: 'Microsoft Sans Serif', sans-serif; font-size: 16px;"
| |
| | [[Microsoft Sans Serif]]
| |
| | Windows 2000
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |- style="font-family: 'Palatino Linotype', serif; font-size: 16px;"
| |
| | [[Palatino Linotype]]
| |
| | Windows 2000
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Franklin Gothic Medium', sans-serif; font-size: 16px;"
| |
| | [[Franklin Gothic Medium]]
| |
| | Windows XP
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Medium, ''Medium Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Segoe UI', sans-serif; font-size: 16px;"
| |
| | [[Segoe UI]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Calibri, sans-serif; font-size: 16px;"
| |
| | [[Calibri]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Cambria, serif; font-size: 16px;"
| |
| | [[Cambria (typeface)|Cambria]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Candara, sans-serif; font-size: 16px;"
| |
| | [[Candara]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Consolas, monospace; font-size: 16px;"
| |
| | [[Consolas]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Constantia, serif; font-size: 16px;"
| |
| | [[Constantia (typeface)|Constantia]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Corbel, sans-serif; font-size: 16px;"
| |
| | [[Corbel (typeface)|Corbel]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |}
| |
|
| |
|
| |
|
| |
| Here are examples of code to use, for various fonts.
| |
| Safe to use inline (see above for details):
| |
| <span style="font-family: Arial;">Arial</span>; the base font,
| |
| <span style="font-family: 'Comic Sans MS';">Comic Sans MS</span>,
| |
| <span style="font-family: Georgia;">Georgia</span>,
| |
| <span style="font-family: 'Trebuchet MS';">Trebuchet MS</span>
| |
| <span style="font-family: Verdana;">Verdana</span>
| |
| Not safe to use inline (see above for details):
| |
| <span style="font-family: 'Times New Roman';">Times New Roman</span>
| |
| <span style="font-family: 'Courier New';">Courier New</span>
| |
|
| |
| ===Core fonts for the Web===
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Sample
| |
| ! Variants
| |
| |- style="font-family: Arial, sans-serif; font-size: 16px;"
| |
| | [[Arial]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Times New Roman', serif; font-size: 16px;"
| |
| | [[Times New Roman]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Courier New', monospace; font-size: 16px;"
| |
| | [[Courier New]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Comic Sans MS', cursive; font-size: 16px;"
| |
| | [[Comic Sans MS]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Georgia, serif; font-size: 16px;"
| |
| | [[Georgia (typeface)|Georgia]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Trebuchet MS', sans-serif; font-size: 16px;"
| |
| | [[Trebuchet MS]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Verdana, sans-serif; font-size: 16px;"
| |
| | [[Verdana]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |}
| |
|
| |
| ====Availability====
| |
|
| |
| The [[Core fonts for the Web]] have an [[installed base]] of 99% on Windows<ref name="Windows" /> (except Andalé Mono) and 92–98% on Mac OS X platforms,<ref name="Mac" /> as they are now part of the standard installation. Despite the necessity to install these fonts separately, they still enjoy an installed base of 65% among Linux installations.<ref name="Linux" />
| |
|
| |
| Originally part of the Core Web fonts, <span style="font-family:Andale Mono">Andalé Mono</span> is ''not'' installed with Windows (having been replaced by <span style="font-family:"Lucida Console">Lucida Console</span>), resulting in only 4% of Windows installations having the font, as opposed to 92% on Mac OS X. It used to be shipped with Internet Explorer until version 6, and was only installed with Windows 98. As the fonts are still available online, it does have an installed base of 70% on Linux. As it is similar and metric-compatible to Lucida Console, it is recommended to always combine Lucida Console and Andalé Mono in a font stack.
| |
|
| |
| iOS has all the fonts listed in the table above, ''except'' Andalé Mono and Comic Sans MS. However, it does have a Comic Sans–like font called Chalkboard SE. Consider using this CSS font stack: <code>font-family: "Comic Sans MS", Chalkboard SE, cursive, sans-serif;</code>
| |
|
| |
| ====Size====
| |
| :''Note: This section holds true for 13px, but since the Typography Refresh, most fonts no longer match in 14px.''
| |
| Fonts that have the same [[cap height]] do not always match in [[x-height]], making them hard to mix inline without scaling. Based on <span style="font-family: Arial;">Arial</span> as the base font, <span style="font-family: 'Comic Sans MS';">Comic Sans MS</span>, <span style="font-family: Georgia;">Georgia</span>, <span style="font-family: 'Trebuchet MS';">Trebuchet MS</span> and <span style="font-family: Verdana;">Verdana</span> are safe to use inline. <span style="font-family: 'Times New Roman';">Times New Roman</span> is ''not'' safe to use inline without scaling. Although <span style="font-family: 'Courier New';">Courier New</span> has a lower height, it remains legible, and is the de facto monospace font. (Arial Black and Impact are not listed, as these are header fonts.)
| |
|
| |
| ==== Header fonts ====
| |
| Arial Black and Impact are part of the set of core fonts for the web, but they are very heavy designs that are only recommended for use at large sizes. In addition, Arial Black is not installed on [[iOS]] devices. Furthermore, Impact is not installed on [[ChromeOS]] devices or older iOS devices.
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Sample
| |
| ! Variants
| |
| |- style="font-family: Arial Black, sans-serif; font-size: 24px;"
| |
| | [[Arial|Arial Black]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Black
| |
| |- style="font-family: Impact, sans-serif; font-size: 24px;"
| |
| | [[Impact (typeface)|Impact]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |}
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Näidis
| |
| ! Variandid
| |
| |- <span style="background:white; color:black; font-family: Old English Text; font-size:100%;">
| |
| | [[Old English Text]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- <span style="background:white; color:black; font-family: Ink Free; font-size:120%;">
| |
| | [[Ink Free]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |}
| |
|
| |
|
| |
| [[Õhne veejõud 3]]
| |
|
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Näidis
| |
| ! Variandid
| |
| |- <span style="background:white; color:red; font-family: Comic Sans MS; font-size:100%;">
| |
| | [[Comic Sans MS]] *
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="<span style="background:white; color:black; font-family: Ink Free; font-size:100%;""
| |
| | [[Times New Roman]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |}
| |
|
| |
| [[Õhne veejõud]]
| |
|
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Sample
| |
| ! Variants
| |
| ! Windows substitute
| |
| |- style="font-family: Helvetica, sans-serif; font-size: 16px;"
| |
| | [[Helvetica]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |<span style="font-family: Arial, Helvetica, sans-serif;">Arial</span>
| |
| |- style="font-family: Times, serif; font-size: 16px;"
| |
| | [[Times (typeface)|Times]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |<span style="font-family: Times New Roman, Times, serif;">Times New Roman</span>
| |
| |- style="font-family: Courier, monospace; font-size: 16px;"
| |
| | [[Courier (typeface)|Courier]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |<span style="font-family: Courier New, Courier, monospace;">Courier New</span>
| |
| |}
| |
|
| |
| ===Common Windows fonts===
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Since
| |
| ! Sample
| |
| ! Variants
| |
| |- style="font-family: Tahoma, sans-serif; font-size: 16px;"
| |
| | [[Tahoma (typeface)|Tahoma]]
| |
| | Windows 98
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold'''
| |
| |- style="font-family: 'Lucida Sans Unicode', sans-serif; font-size: 16px;"
| |
| | [[Lucida Sans Unicode]]
| |
| | Windows 98
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |- style="font-family: 'Lucida Console', monospace; font-size: 16px;"
| |
| | [[Lucida Console]]
| |
| | Windows 98
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |- style="font-family: 'Microsoft Sans Serif', sans-serif; font-size: 16px;"
| |
| | [[Microsoft Sans Serif]]
| |
| | Windows 2000
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |- style="font-family: 'Palatino Linotype', serif; font-size: 16px;"
| |
| | [[Palatino Linotype]]
| |
| | Windows 2000
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Franklin Gothic Medium', sans-serif; font-size: 16px;"
| |
| | [[Franklin Gothic Medium]]
| |
| | Windows XP
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Medium, ''Medium Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Segoe UI', sans-serif; font-size: 16px;"
| |
| | [[Segoe UI]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Calibri, sans-serif; font-size: 16px;"
| |
| | [[Calibri]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Cambria, serif; font-size: 16px;"
| |
| | [[Cambria (typeface)|Cambria]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Candara, sans-serif; font-size: 16px;"
| |
| | [[Candara]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Consolas, monospace; font-size: 16px;"
| |
| | [[Consolas]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Constantia, serif; font-size: 16px;"
| |
| | [[Constantia (typeface)|Constantia]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Corbel, sans-serif; font-size: 16px;"
| |
| | [[Corbel (typeface)|Corbel]]
| |
| | Windows Vista
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |}
| |
|
| |
|
| |
|
| |
| Here are examples of code to use, for various fonts.
| |
| Safe to use inline (see above for details):
| |
| <span style="font-family: Arial;">Arial</span>; the base font,
| |
| <span style="font-family: 'Comic Sans MS';">Comic Sans MS</span>,
| |
| <span style="font-family: Georgia;">Georgia</span>,
| |
| <span style="font-family: 'Trebuchet MS';">Trebuchet MS</span>
| |
| <span style="font-family: Verdana;">Verdana</span>
| |
| Not safe to use inline (see above for details):
| |
| <span style="font-family: 'Times New Roman';">Times New Roman</span>
| |
| <span style="font-family: 'Courier New';">Courier New</span>
| |
|
| |
| ===Core fonts for the Web===
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Sample
| |
| ! Variants
| |
| |- style="font-family: Arial, sans-serif; font-size: 16px;"
| |
| | [[Arial]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Times New Roman', serif; font-size: 16px;"
| |
| | [[Times New Roman]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Courier New', monospace; font-size: 16px;"
| |
| | [[Courier New]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Comic Sans MS', cursive; font-size: 16px;"
| |
| | [[Comic Sans MS]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Georgia, serif; font-size: 16px;"
| |
| | [[Georgia (typeface)|Georgia]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: 'Trebuchet MS', sans-serif; font-size: 16px;"
| |
| | [[Trebuchet MS]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |- style="font-family: Verdana, sans-serif; font-size: 16px;"
| |
| | [[Verdana]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular, '''Bold''', ''Italic'', '''''Bold Italic'''''
| |
| |}
| |
|
| |
| ====Availability====
| |
|
| |
| The [[Core fonts for the Web]] have an [[installed base]] of 99% on Windows<ref name="Windows" /> (except Andalé Mono) and 92–98% on Mac OS X platforms,<ref name="Mac" /> as they are now part of the standard installation. Despite the necessity to install these fonts separately, they still enjoy an installed base of 65% among Linux installations.<ref name="Linux" />
| |
|
| |
| Originally part of the Core Web fonts, <span style="font-family:Andale Mono">Andalé Mono</span> is ''not'' installed with Windows (having been replaced by <span style="font-family:"Lucida Console">Lucida Console</span>), resulting in only 4% of Windows installations having the font, as opposed to 92% on Mac OS X. It used to be shipped with Internet Explorer until version 6, and was only installed with Windows 98. As the fonts are still available online, it does have an installed base of 70% on Linux. As it is similar and metric-compatible to Lucida Console, it is recommended to always combine Lucida Console and Andalé Mono in a font stack.
| |
|
| |
| iOS has all the fonts listed in the table above, ''except'' Andalé Mono and Comic Sans MS. However, it does have a Comic Sans–like font called Chalkboard SE. Consider using this CSS font stack: <code>font-family: "Comic Sans MS", Chalkboard SE, cursive, sans-serif;</code>
| |
|
| |
| ====Size====
| |
| :''Note: This section holds true for 13px, but since the Typography Refresh, most fonts no longer match in 14px.''
| |
| Fonts that have the same [[cap height]] do not always match in [[x-height]], making them hard to mix inline without scaling. Based on <span style="font-family: Arial;">Arial</span> as the base font, <span style="font-family: 'Comic Sans MS';">Comic Sans MS</span>, <span style="font-family: Georgia;">Georgia</span>, <span style="font-family: 'Trebuchet MS';">Trebuchet MS</span> and <span style="font-family: Verdana;">Verdana</span> are safe to use inline. <span style="font-family: 'Times New Roman';">Times New Roman</span> is ''not'' safe to use inline without scaling. Although <span style="font-family: 'Courier New';">Courier New</span> has a lower height, it remains legible, and is the de facto monospace font. (Arial Black and Impact are not listed, as these are header fonts.)
| |
|
| |
| ==== Header fonts ====
| |
| Arial Black and Impact are part of the set of core fonts for the web, but they are very heavy designs that are only recommended for use at large sizes. In addition, Arial Black is not installed on [[iOS]] devices. Furthermore, Impact is not installed on [[ChromeOS]] devices or older iOS devices.
| |
| {| class="wikitable"
| |
| ! Font
| |
| ! Sample
| |
| ! Variants
| |
| |- style="font-family: Arial Black, sans-serif; font-size: 24px;"
| |
| | [[Arial|Arial Black]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Black
| |
| |- style="font-family: Impact, sans-serif; font-size: 24px;"
| |
| | [[Impact (typeface)|Impact]]
| |
| | The Quick Brown Fox Jumps Over The Lazy Dog.
| |
| | Regular
| |
| |}
| |
|
| |
|
| |
| <!--
| |
| notoc__
| |
| ==Menüü proov:==
| |
| <div style='text-align: left; font-family: Helvetica; font-size:115%'>
| |
| <span style="background:#ebecf0; color:#4259a9; >[[Mõisatõlk| Mõisatõlk ]]</span style>
| |
| <span style="background:#ebecf0; color:#4259a9; >[[SISUPUU| Artiklite teemavalik ]]</span style>
| |
| <span style="background:#ebecf0; color:#4259a9; >[[KLOON| Veskiartikli mallid ]]</span style>
| |
| <br>
| |
| <span style="background:#ebecf0; color:#4259a9; >[[Weskiwiki kasutamine| Kasutamine ]]</span style>
| |
| <span style="background:#ebecf0; color:#4259a9; >[https://www.mediawiki.org/wiki/Help:Contents Mediawiki Help (eng)] </span style>
| |
| <br>
| |
| <span style="background:#ebecf0; color:#4259a9; >[https://et.wikipedia.org/wiki/Juhend:Lehek%C3%BClje_muutmine Vormistuse-abi Vikipeedias (est)]</span style>
| |
| <span style="background:#ebecf0; color:#4259a9; >[https://www.google.com/maps/d/edit?mid=1sKF7eERdafqedmV56vP3lCeW1LGMTTU&usp=sharing Veskite kaart Google-maps rakenduses (proov-test)]</span style>
| |
| <span style="background:#ebecf0; color:#4259a9; font-size:90%>[[MALLID| Mallide kasutamine ]]</span style>
| |
| <span style="background:#ebecf0; color:#4259a9; >[[Märgendid ja Mallid]]</span style>
| |
| <br>
| |
| <span style="background:#ebecf0; color:#4259a9; font-size:100%>[[Special:Search| Otsing ]]</span style>
| |
| <br>
| |
| </div style>
| |
|
| |
|
| ==Alfabeetiline menüü:== | | ==Alfabeetiline menüü:== |
_960x640.jpg)
