- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Tue, 13 Dec 2011 08:30:17 -0800
- 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 UTC