css @font-face code example
Example 1: import font css
@font-face {
font-family: "Open Sans";
src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
url("/fonts/OpenSans-Regular-webfont.woff") format("woff");
}
Example 2: use .ttf in css
@font-face {
font-family:"Name-Of-Font";
src: url("yourfont.ttf") format("truetype");
}
Example 3: css font face
@font-face {
// Defining what the font will be called
font-family: thisSpecialFont;
// Linking to the font file
src: url(linkToFontFile.woff);
}
body {
font-family: thisSpecialFont;
}
Example 4: font-face html
@font-face {
font-family: 'PacificoRegular';
src: url('Pacifico-webfont.eot');
src: url('Pacifico-webfont.eot?#iefix') format('embedded-opentype'),
url('Pacifico-webfont.woff') format('woff'),
url('Pacifico-webfont.ttf') format('truetype'),
url('Pacifico-webfont.svg#PacificoRegular') format('svg');
font-weight: normal;
font-style: normal;
}
Example 5: how to find a fontface url
@font-face {
font-family: Chunkfive;
src: url('Chunkfive.otf');
}
Example 6: @font-face
@font-face {
font-family: "The name of your font for your file";
src: url("The link to your .ttf or .otf file");
}