- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Mon, 4 Mar 2013 07:31:31 -0800
- To: Adam Prescott <adam@aprescott.com>
- Cc: www-style list <www-style@w3.org>
- Message-ID: <CAAWBYDC1usEoJqrE_MnFN3qtF1L-Q24C3J9vvN6Wf2dDivn=PA@mail.gmail.com>
On Mar 4, 2013 6:32 AM, "Adam Prescott" <adam@aprescott.com> wrote: > > As you all know, the @font-face rule allows a new font-family name to > be defined, and the src property defines where the font can be found. > However, there is no way to "chain" @font-face rules together, I > believe. If there is, I couldn't find it in the current CSS Fonts > module spec. > > Let me give a use-case, which I described in a blog post elsewhere[1]. > > Google Web Fonts (or some other third party) may have provided a > @font-face rule via a <script> or @import, which would have the effect > of giving this CSS: > > @font-face { > font-family: FooBar; > src: local("Foo Bar"), url("...") format("..."); > } > > In your own CSS, you may wish to use unicode-range to restrict the > styling of FooBar to only certain characters (in this case, &): > > @font-face { > font-family: Baz; > src: local("FooBar"); /* doesn't work */ > unicode-range: U+26; > } > > p { font-family: Baz, serif; } > > This is especially useful if the third party has returned a version of > FooBar containing only glyphs for U+0026, versus the entire set of > characters (increasing loading times). But, because FooBar is not > installed locally, local("FooBar") won't apply, and so Baz cannot be > used for this purpose. > > Is there any way to achieve this? If not, perhaps something similar to > local() could be defined that would use other @font-face rules. Or > maybe local() could also do that. In either case, perhaps there are > parallelism issues: if the @font-face rule is in a separate file (or > comes via a <script>), then unless a @font-face rule should block (as > in block the CSS processing) on local() font-family values, the name > might not yet be available? Although perhaps on subsequent requests > the browser would likely have the @font-face font name available and > would know it can be used? > > [1]: https://aprescott.com/posts/specific-character-fonts Actually, your use case is already handled by the spec - just create multiple @font-face rules with the same name, and the browser will automatically combine them together into a single face. You may already know that this works with weight/style/etc, but it works with unicode-range too. ~TJ
Received on Monday, 4 March 2013 15:32:01 UTC