HTML and CSS Reference
In-Depth Information
Figure 5-7. Browsers that support unicode-range download only the quotes, not the full font
The problem with using unicode-range is that it's not currently supported by Firefox or Opera, so those
two browsers download the entire font rather than the characters you want. However, British web developer
Drew McLellan has devised a crafty technique to prevent Firefox and Opera from downloading the whole font
( ). It involves creating a second @font-face rule that specifies a local
font as the source of the same font-family descriptor like this:
@font-face {
font-family: 'Limelight Quotes';
src: local(Georgia);
unicode-range: U+270C;
In the second @font-face rule, unicode-range specifies an obscure symbol that will never be used in your
page. Firefox and Opera treat the second rule as overriding the first, but other browsers simply add the new
unicode-range value to the existing one. But because the font is local, there's nothing to download, so the rule is
harmless. Figure 5-8 shows the result in Firefox.
Figure 5-8. The second @font-face rule prevents Firefox from downloading the web font
Search WWH ::

Custom Search