Loading an external font via inline CSS

Question

Is it possible to load an external font via inline CSS?

Note: I\'m not talking about using an external CSS file with a @font-face definition, b

Answer 1

If you use @font-face, you should be able to do something like this:

CSS

@font-face {
font-family: 'RalewayThin';
src: url('fonts/raleway_thin-webfont.eot');
src: url('fonts/raleway_thin-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/raleway_thin-webfont.woff') format('woff'),
     url('fonts/raleway_thin-webfont.ttf') format('truetype'),
     url('fonts/raleway_thin-webfont.svg#RalewayThin') format('svg');
font-weight: normal;
font-style: normal;

}

Make sure to include the fonts - the above example has placed all of the fonts in a relative-path directory to the css file.

HTML

You should be able to find free web-based @font-face fonts here.