Forum Home
Press F1
 
Thread ID: 135432 2013-11-01 08:18:00 script common to all OSs John L. (5716) Press F1
Post ID Timestamp Content User
1358495 2013-11-05 18:33:00 No client side script needed. @fontfance is a CSS3 only media query that usually lives at the top of your style sheet and looks like this...

@font-face {
font-family: 'ExoThin';
src: url('../fonts/Exo-Thin-webfont.eot');
src: url('../fonts/Exo-Thin-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/Exo-Thin-webfont.woff') format('woff'),
url('../fonts/Exo-Thin-webfont.ttf') format('truetype'),
url('../fonts/Exo-Thin-webfont.svg#ExoThin') format('svg');
font-weight: normal;
font-style: normal;

}

You then have another folder called font or fonts ( your choice) and this sits at the top of your root directory. You can put any web fonts in the fonts folder that your design requires, these are then used on your style sheet in conjunction with your regular XHTML fonts which will work on older browsers. The set up looks like this

h2.sub-title {
font-family: 'ColaborateLightRegular',Helvetica;
font-size: 1.3em;
margin-top: 0;
color: black;
text-align: center;
}

Collaborate is my CSS3 font.
. I typically search the Font Squirrel website to get my fonts. Google has its own font set up as well.

CSS3 fonts only work on HTML5 sites, so it you may need to download an HTML5 boilerplate from here html5boilerplate.com You can download the basic one or you can customise it then download it. You will also need to at a warning for IE 8 browsers into your HTML and CSS.
I normally do

Let me know how you get on. :) 		Webdevguy (17166)
1358496 2013-11-05 18:44:00 If the fonts you choose are not web fonts then you can upload them to the web font generator www.fontsquirrel.com and put the resulting fonts into your fonts folder with the font specs going on your style sheet

Btw, have you ever used the HTML5 boilerplate before? 		Webdevguy (17166)
1 2 3