HTML and CSS Reference
In-Depth Information
A subtle difference you may have noted is that the original example used a
font-weight of bold , but the second example used a font-weight of normal . This
is because the @font-face rules explicitly specified the bold versions of
the fonts, but it's possible to handle that directly with font-face .
The browser has two options when bold text is needed: it can either use
a bold version of the font if one is available or scale up the normal font
to make it look bold.
Let's start with some normal text
using the Yanone Kaffeesatz font:
<p>Hello! HTML5 and CSS3</p>
Here's the CSS :
@font-face {
font-family: "Yanone Kaffeesatz";
src: url(YanoneKaffeesatz-Regular.otf) format("opentype");
p {
font-size: 32px;
font-family: "Yanone Kaffeesatz";
Now add a couple of elements that
will render as bold:
<p>Hello! <strong>HTML5</strong> and
Search WWH ::

Custom Search