@font-face issues

I have done this before, but still haven't mastered it. I downloaded a font kit from fontsquirrel.com and tried to get my custom font to work on my site. I have tried so many variations including the "bullet proof" methods found online that I have now confused myself. Could someone look at the code below and show me how to correctly get a custom font to work on a website using @font-face? I have a style sheet named **fonts.css** located in a folder named **css**. This is being used to call the custom font. The font files are located in a folder from the root named **fonts**. The css for the style sheet **fonts** is: @font-face { font-family: 'BebasNeueRegular'; src: url('../fonts/bebasneue-webfont.woff') format('woff'), url('../fonts/bebasneue-webfont.ttf') format('truetype'), url('../fonts/bebasneue-webfont.webfontABYyK1dn') format('svg'); font-weight: normal; font-style: normal; The other styles sheets for layout, etc call the font like this: } #merchandise h1 { font-family: "Bebas Neue", Arial, Helvetica, sans-serif; font-size: 33px; font-weight: normal; line-height: normal; text-transform: uppercase; letter-spacing: 1px; } Anything obvious? Of course, it works locally on my machine because I have the font installed.

以上就是@font-face issues的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准