开发者

visual studios not rendering @font-face, relative path issue possibly?

Someone please help me on this issue with @font-face. I have used this technique multiple times and for some reason I can not for the life of me figure out why the font-face is not rendering.

So I have a project called Web.Ui.Store in Visual Studio with two important subdirectories. 1. /Content/css/Typography.css 2. /Content/font/UTILITY-webfont.eot (I have all the fonts provided by FontSquirrel but for explanation just labeling naming this extension.)

Now within the Typography.css I have these lines of code.

 @font-face {
font-family: 'UtilityBoldCondensed';
    src: url('file:///C:/dev/trunk/Source/Web.Ui.Store/Content/font/UTILITY-webfont.eot#iefix');
    src: url('file:///C:/dev/trunk/Source/Web.Ui.Store/Content/font/UTILITY-webfont.eot?') format('embedded-opentype'),
    url('file:///C:/dev/trunk/Source/Web.Ui.Store/Content/font/UTILITY-webfont.woff') format('woff'),
    url('file:///C:/dev/trunk/Source/Web.Ui.Store/Content/font/UTILITY-webfont.ttf') format('truetype'),
    url('file:///C:/dev/trunk/Source/Web.Ui.Store/Content/font/UTILITY-webfont.svg#UtilityBoldCondensed') format('svg');
font-weight: bold;
font-style: normal;
 }

 @font-face {
font-family: 'LeagueGothicRegular';
src: url('C:\dev\trunk\Source\Web.Ui.Store\Content\font\League_Gothic-webfont.eot');
src: url('C:\dev\trunk\Source\Web.Ui.Store\Content\font\League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
     url('C:\dev\trunk\Source\Web.Ui.Store\Content\font\League_Gothic-webfont.woff') format('woff'),
     url('C:\dev\trunk\Source\Web.Ui.Store\Content\font\League_Gothic-webfont.ttf') format('truetype'),
     url('C:\dev\trunk\Source\Web.Ui.Store\Content\font\League_Gothic-webfont.svg#LeagueGothicRegular') format('svg');
font-weight: normal;
font-style: normal;

 }

 .UtilityBoldCondensed { font-family: 'UtilityBoldCondensed', Arial, Sans-Serif; }
 .LeagueGothicRegular { font-family: 'LeagueGothicRegular', Arial, Sans-Serif; }

I am confused as to why my "special"fonts won't load on my project. I have cha开发者_如何学JAVAnged the relative path so many times today and still can not get it to render. I have narrowed the problem down to it being an issue with the relative paths for the locations of the files. Can someone help determine if this is correct.


As I can see on google's web-font; the @font-face is always inside a @media screen {}...

Check this out:
http://fonts.googleapis.com/css?family=PT+Sans:regular,italic,bold,bolditalic

0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜