GO: With God II



testing different syntax


This page is a demonstration of a few @font-face syntax techniques, most notably from bulletproof @font-face syntax and Mo’ Bulletproofer @Font-Face CSS Syntax.

original bulletproof syntax

@font-face {
font-family: bulletproof;
src: url(‘/wp-content/themes/majestics/fonts/yanone.eot’);
src: local(‘Yanone’), url(/wp-content/themes/majestics/fonts/yanone.ttf) format(“truetype”);
}

bulletproof with no quotes around local name

@font-face {
font-family: bulletproofnoquotes;
src: url(‘/wp-content/themes/majestics/fonts/yanone.eot’);
src: local(Yanone), url(‘/wp-content/themes/majestics/fonts/yanone.ttf’) format(“truetype”);
}

mo bullet proofer

@font-face{
font-family:mobulletproofer;
src:url(/wp-content/themes/majestics/fonts/yanone.eot);
}
@font-face {
font-family:mobulletproofer;
src:url(//:) format(“No-IE-404”),url(/wp-content/themes/majestics/fonts/yanone.ttf) format(“truetype”);
}

no quotes on url


@font-face {
font-family: bulletproofnoquotes2;
src: url(‘/wp-content/themes/majestics/fonts/yanone.eot’);
src: local(‘Yanone’), url(/wp-content/themes/majestics/fonts/yanone.ttf) format(“truetype”);
}

no format property, no quotes around either url

@font-face {
font-family: noformat;
src: url(/wp-content/themes/majestics/fonts/yanone.eot);
src: local(‘Yanone’), url(/wp-content/themes/majestics/fonts/yanone.ttf);
}

locally installed with local font name

@font-face {
font-family: localref;
src: url(/wp-content/themes/majestics/fonts/yanone.eot);
src: local(‘Yanone Tagesschrift’), local(‘Yanone’), local(‘Yanone Tagesschrift’), url(/wp-content/themes/majestics/fonts/nottherealpath.ttf) format(‘tuetype’);
}

basic with missing local quotes (no eot)

@font-face {
font-family: basic;
src: local(Yanone), url(‘/wp-content/themes/majestics/fonts/yanone.ttf’) format(“truetype”);
}

only the eot

@font-face {
font-family: onlyeot;
src: url(‘/wp-content/themes/majestics/fonts/yanone.eot’);
}

bulletproof with smileyface as local name

@font-face {
font-family: bulletproofsmiley;
src: url(‘/wp-content/themes/majestics/fonts/yanone.eot’);
src: local(‘☺’), url(‘/wp-content/themes/majestics/fonts/yanone.ttf’) format(“truetype”);
}

cross-domain font request

@font-face {
font-family: crossdomain;
src: url(‘http://paulirish.com/tagesschrift.eot’);
src: local(‘☺’), url(‘http://paulirish.com/tagesschrift.ttf’) format(“truetype”);
}