HTML and CSS Reference
In-Depth Information
font-style: normal;
}
Notice that a few things have been changed here.
../fonts/
has been added in front of all
the file references, which matches the fact that the files are located up one level in relation to
the CSS file, and inside the fonts folder.
The other change to note is the value for
font-family
to
ChelseaMarket
. The pre-
vious value (
chelsea_marketregular
) would work fine, but was tricky to remember.
This name, as defined in this location, can be anything we want. We just have to ensure that
we use the exact same name when we reference this font in our CSS, which we'll do in a
moment.
With that in place, we can make similar changes to our two Lato
@font-face
declarations:
@font-face {
font-family: 'LatoBold';
src: url('../fonts/lato-bold-webfont.eot');
src: url('../fonts/lato-bold-webfont.eot?#iefix')
format('
↵
embedded-opentype'),
url('../fonts/lato-bold-webfont.woff')
format('woff'),
url('../fonts/lato-bold-webfont.ttf')
format('truetype'),
url('../fonts/lato-bold-webfont.svg#latobold')
format
↵
('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Lato';
src: url('../fonts/lato-regular-webfont.eot');
src: url('../fonts/lato-regular-webfont.eot?#iefix')
format('
