CSS字体无法正常工作

Question

Hey Ya'll my CSS font face is not working, I have no idea why, it was working a few days ago...

Here is the CSS

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

}

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

}


body{
    font-family:TrajanProBold;
    background-color:#ebebeb;
    padding:0;
    margin:0;
}

and this

<link rel="stylesheet" href="http://www.willruppelglass.com/css/slimbox2.css" type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="http://www.willruppelglass.com/css/styles.css" />

Any Help would be appreciated, J

Answer 1

Looking at your stylesheet ( http://www.willruppelglass.com/css/styles.css ), I can see that the TrajanProBold is being applied to only two elements:

body and input

However, the Slimbox stylesheet ( http://www.willruppelglass.com/css/slimbox2.css ) has another font stack applied to

#lbBottom

So, the Slimbox fonts would override the TrajanProBold font, at least on the element mentioned.

Answer 2

Change

src: url('trajanpro-regular-webfont.eot');

to

src: url('trajanpro-regular-webfont.ttf');

Answer 3

check your .htaccess in root folder as well in sub directories. Apply following code to appropriate .htaccess file.

Order deny,allow
    Deny from all
    <Files ~ ".(xml|css|jpe?g|png|gif|js|svg|woff|ttf|eot|woff2)$">
    Allow from all
    </Files>

Answer 4

In my experience with custom fonts you need the '' so you should try it as 'TrajanProBold'. Hopefully its as simple as that.