How best to Force Unique font - Noob 101, @font-face not behaving |
How best to Force Unique font - Noob 101, @font-face not behaving |
BalancedLineOut |
Feb 15 2012, 02:39 PM
Post
#1
|
Newbie Group: Members Posts: 11 Joined: 15-February 12 Member No.: 16,487 |
I remember a few years ago building a ebsite and specifying a unique font using the M/S WEFT tool. I want to force browsers to use a specific font again, and came across "@font-face". I used the online utility font-squirrel, and even after doing that, I can't get the unique font to load in my web page. The sample they provide works fine, so it has to be something I'm doing... or not doing.
I know this sounds really nasty, but I've not worked with CSS before this past weekend, although I can immediately see it's advantages, and I've created so very nice pages with it. I seem to be missing the boat on this font thing, something that should be relatively simple. I guess I'm confiused as to where the specific pieces of code go... in the index.html or the sytle.css file. Non of the tutorials are clear on that, and assume more knowledge on the subject than I have. I've even gone back to the basics - since the site I was trying to apply this to was kind of busy with code - and started working fresh on new files. Still can't get the font to work....unless I load it as a system font,. Thks for the read, and putting up with another noob. S~ |
BalancedLineOut |
Feb 15 2012, 03:36 PM
Post
#2
|
Newbie Group: Members Posts: 11 Joined: 15-February 12 Member No.: 16,487 |
Well...hmmm...
Not getting any love out of this exercise. This is as far as I get. IN the index.htm file I put <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link rel="test" href="test.css" type="text/css" charset="utf-8" /> </head> On the test.css file, it looks like this... @font-face { font-family: 'DistortiaRegular'; src: url('distorti-webfont.eot'); src: url('distorti-webfont.eot?#iefix') format('embedded-opentype'), url('distorti-webfont.woff') format('woff'), url('distorti-webfont.ttf') format('truetype'), url('distorti-webfont.svg#DistortiaRegular') format('svg'); font-weight: normal; font-style: normal; } .style2 { font-family: distorti-webfont; font-size: 18px; font-style: normal; font-weight: 400; font-variant: normal; color: #FF0000; line-height: normal; text-transform: none; } Text does not adopt the new font. Like I said, I must be missing something....and even though I don't like to have it that way, all the files for this test page are in the root of the site....until I get it working. Then I can tidy that up later. This post has been edited by BalancedLineOut: Feb 15 2012, 03:38 PM |
Lo-Fi Version | Time is now: 13th May 2024 - 01:00 AM |