Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can relative paths be used for @font-face src?

Tags:

css

font-face

When using @font-face in CSS to use custom fonts, can I specify a relative path for the fonts. Say I have the following structure:

WebContent
 - css
    |- style01.css
    |- style02.css
    |- ...
 - fonts
    |- font01.ttf
    |- font01.ttf
    |- ...
 - images
    |- ...
 - js
    |- ...
 - index.html
 - *.html

Can I specify something similar to:

@font-face {
   font-family: 'font one';
   src: url('../fonts/font01.ttf');
}

since the above does not seem to work.

like image 871
Nico Huysamen Avatar asked Mar 26 '12 10:03

Nico Huysamen


People also ask

What is SRC in font face?

src. Specifies the resource containing the font data. This can be a URL to a remote font file location or the name of a font on the user's computer.

How do you use font family property?

Tip: The font-family property should hold several font names as a "fallback" system, to ensure maximum compatibility between browsers/operating systems. Start with the font you want, and end with a generic family (to let the browser pick a similar font in the generic family, if no other fonts are available).


1 Answers

Seems the issue was that it doesn't like the single quotes ' around the name.

like image 83
Nico Huysamen Avatar answered Sep 21 '22 19:09

Nico Huysamen