Skip to content

Instantly share code, notes, and snippets.

@boyofgreen
Created April 9, 2012 02:13
Show Gist options
  • Save boyofgreen/2340857 to your computer and use it in GitHub Desktop.
Save boyofgreen/2340857 to your computer and use it in GitHub Desktop.
HTML5 Hacks 3.1
@font-face {
font-family: 'Radley';
font-style: normal;
font-weight: normal;
src: local('Radley'), url('../fonts/Radley.woff') format('woff');
}
@font-face {
font-family: 'Lovers Quarrel';
font-style: normal;
font-weight: 400;
src: local('Lovers Quarrel'), url('../fonts/quarrel.woff') format('woff');
}
@font-face {
font-family: 'Dosis';
font-style: normal;
font-weight: 400;
src: local('Dosis Regular'), url('../fonts/dosis.woff') format('woff');
}
.fontHeader {
font-family: Radley, Arial, sans-sarif;
}
h2.fontHeader {
font-size: 12em;
line-height: 1em;
font-family: Lovers Quarrel, Arial, sarif;
text-align: center;
color: #c91c10;
}
.smallFont {
font-family: Dosis, Arial, sans-serif;
text-align: justify;
}
@font-face {
font-family: 'Radley';
font-style: normal;
font-weight: normal;
src: local('Radley'), url('../fonts/Radley.woff') format('woff');
}
@font-face {
font-family: 'Radley';
font-style: normal;
font-weight: 800;
src: local('Radley'), url('../fonts/RadleyBold.woff') format('woff');
}
@font-face {
font-family: 'Radley';
font-style: italic;
font-weight: normal;
src: local('Radley'), url('../fonts/RadleyItalic.woff') format('woff');
}
and now the easy implimentation:
.fontHeader {
font-family: Radley, Arial, sans-sarif;
}
.fontHeader.bold {
font-weight: 800;
}
.fontHeader.italic {
font-style: italic;
}
@font-face {
font-family: 'Radley';
src: local('Radley'), url('../fonts/Radley.woff') format('woff');
}
@font-face {
font-family: 'RadleyBold';
src: local('Radley'), url('../fonts/RadleyBold.woff') format('woff');
}
@font-face {
font-family: 'RadleyItalic';
src: local('Radley'), url('../fonts/RadleyItalic.woff') format('woff');
}
.fontHeader {
font-family: Radley, Arial, sans-sarif;
}
.fontHeader.bold {
font-family: RadleyBold, Arial, sans-sarif;
}
.fontHeader.italic {
font-family: RadleyItalic, Arial, sans-sarif;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment