W3C home > Mailing lists > Public > www-style@w3.org > December 2011

Re: [css3-fonts] "font-style" and "font-weight" in "@font-face"

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Tue, 13 Dec 2011 08:30:17 -0800
Message-ID: <CAAWBYDC27QB05dw9JrsLWxCBzPg26_4NMe1cmbg7Rr7Sb4djpg@mail.gmail.com>
To: tao.yu@nokia.com
Cc: www-style@w3.org, Art.Barstow@nokia.com
On Tue, Dec 13, 2011 at 8:17 AM,  <tao.yu@nokia.com> wrote:
> Hi,
>
> How do “font-style” and “font-weight” in “@font-face” impact the defined
> font? I have a test case to specify my own font via “@font-face”,  with
> preferred “font-style” and “font-weight”, like below:
>
> @font-face {
>
>                 font-family: myFont1;
>                 src: url("fonts/times.ttf");
>                 font-style: italic;
>                 font-weight: bold;
>     }
>
> And
>
>     @font-face {
>                 font-family: myFont2;
>                 src: local("Times New Roman");
>                 font-style: italic;
>                 font-weight: bold;
> }
>
> But somehow in either case “font-style” and “font-weight” do not work on any
> of the PC browsers (Firefox/IE/Chrome/Opera).  It only works without
> @font-face:
>
>         font-family: "Times New Roman";
>         font-style: italic;
>         font-weight: bold;
>
> My testing page is located at here:
>
> http://waplabdc.nokia-boston.com/browser/users/temp/font_face_test.html
>
> Can someone help to clarify how “font-style” and “font-weight” work within
> @font-face?

The various font-* properties in @font-face do not style the font,
they specify the *font's* style.  That is, your @font-face
declarations above declare that when you use MyFont1 with italic and
bold, you'll receive that face.  This allows you to specify multiple
faces in a font, and declare which combination of font-* property
values should use each face.

~TJ
Received on Tuesday, 13 December 2011 19:27:20 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:47 GMT