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

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?

Thanks,
-Tao

Received on Tuesday, 13 December 2011 16:20:27 UTC