开发者

css font-face does not work for @fonsquirrel

开发者 https://www.devze.com 2023-01-17 07:13 出处:网络
I have this code in my css file from the @fontsquirrel generator: /// changed the code to how it is now ///

I have this code in my css file from the @fontsquirrel generator:

/// changed the code to how it is now ///

@font-face {
font-family: 'AdLibRegular';
src:    url('../fonts/adlib-webfont.eot');
src:    local('☺'), url('../fonts/adlib-webfont.woff') format('woff'), 
        url('../fonts/adlib-webfont.ttf') format('truetype'), 
        url('../fonts/adlib-webfont.svg#webfontmAc00Ivp') format('svg');
font-weight: normal;
font-style: normal;
}

.AdLib {
        font-weight: normal;
        font-style: normal;
        line-height:normal;
        font-family: 'AdLibRegular', sans-serif;
}

this is stored in a folder called css and the fonts are stored in a folder called fonts.

I can't get this to work when in the html page I'm calling it for example

&开发者_StackOverflow社区lt;h1 class="AdLib">Testing Testing 1 2 3</h1>

I can't work out what I'm doing wrong at all.

Any ideas?

I have now changed them all to url ('../fonts/adlib etc and it still doesn't work. I'm previewing locally - is this it?


could be a problem with the path, where is the font folder located according to the css file?

if the font folder is in the css folder you should use the following path:

src:    url('fonts/adlib-webfont.eot');

if it's next to the css map you need to use the following path:

src:    url('../fonts/adlib-webfont.eot');

../ is used to go back a folder


I've run into problems with font-face where the URL starts with a '/' - try editing the src URL to be a relative URL:

eg

@font-face {
font-family: 'AdLibRegular';
src:    url('../fonts/adlib-webfont.eot');
}

(obviously point to the correct folder location)

0

精彩评论

暂无评论...
验证码 换一张
取 消