It would be easier for development if I can just embed every typeface I'm likely to use, but I definitely don't want the extra HTTP requests for fonts that don't end up anywhere in the page. Can anyone enlighten me?
Essentially, a browser looks at each sequence of fonts as first font choice, second font choice, third font choice, and so on. If a browser is unable to find any of the fonts in the sequence it will revert to a default serif, sans serif, or monospace font, depending on the font classification used.
The @font-face CSS at-rule specifies a custom font with which to display text; the font can be loaded from either a remote server or a locally-installed font on the user's own computer.
#Method 1: By combining CSS files This means you can simply copy and paste the files you were importing, directly into the original file. This will remove the need to import the file. Another way is that you can add a separate link in the header of HTML instead of adding CSS@import.
IE will download the .eot file immediately when it encounters the @font-face declaration.
Gecko, Webkit, and Opera all wait until they encounter HTML that matches a CSS rule with a fontstack including the @font-face font.
-- http://paulirish.com/2009/fighting-the-font-face-fout/
So were it not for IE, it actually would be safe to embed lots of fonts, as long as you're careful not to refer to unused ones in your CSS styles, because at that point they will be downloaded by the browser.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With