HTML and CSS Reference
In-Depth Information
color: #333;
}
Inourcase, this won'tbeparticularly noticeable after wefinish styling the rest
of the text on the page. That said, it'll serve as a default text color everywhere
that text color isn't specifically defined.
Similarly, you might have other generic font styles applied to elements like
h1
,
h2
,
h3
,
p
, and so forth. Although we're not doing this extensively on Re-
cipeFinder, it's something you'll want to do on most projects. This'll help you
avoid having to add too many unnecessary classes on elements that can just
be styled by targeting them using the element type selector.
Laterinthischapter,we'llfixuptherestofthetextstylesforallthesectionsofRecipeFinder,
but for now let's discover the concept of embedding custom web fonts, which you'll be doing
often on the websites you build.
Using Custom Web Fonts
At this point, there are a few style changes we want to make to the text on RecipeFinder, in-
cluding changing the size of the text. But before we attempt that, we need to get the correct
fonts to display on our web page. For this design, we've used two custom fonts, shown in
Figure 4.2
—a screenshot depicting part of the sidebar in the original Photoshop design.
