View Single Post
Old 05-22-2010, 01:08 PM   #5
jswinden
Nameless Being
 
I looks as though your CSS was okay for @font-face { } code but I didn't see a reference to use the "Georgia" font face. See the BODY tag statement in the example below.

A font family can be assigned multiple fonts for normal, bold, italic, and bold-italic text. (See second example.) If you want to use multiple font familes you will need to embed all the fonts in the file, which will make for a large, cumbersome file.

Example 1: Georgia font family

If you want to reference the Georgia font installed into the Sony PRS-600 root in a folder named fonts, then you would use this CSS:

Quote:
@font-face {
font-family: "Georgia";
font-weight: normal;
font-style: normal;
src: url(res:///Data/fonts/georgia.ttf);
}

@font-face {
font-family: "Georgia";
font-weight: bold;
font-style: normal;
src: url(res:///Data/fonts/georgiab.ttf);
}

@font-face {
font-family: "Georgia";
font-weight: normal;
font-style: italic;
src: url(res:///Data/fonts/georgiai.ttf);
}

@font-face {
font-family: "Georgia";
font-weight: bold;
font-style: italic;
src: url(res:///Data/fonts/georgiaz.ttf);
}

body { font-family: "Georgia", serif; }
This assumes that you only use the font-family value in the BODY tag. If you use the font-family value in the other tags then you need to either delete the font-family value from those tags are change them to a value of "Georgia". In CSS ensure you use the proper case as case sensitvity is important when referring to file names and value names.

src: url(res:///Data/fonts/ is pointing to the fonts folder on the ROOT of the PRS-600 (or 300 or 900).

Notice that there are four font files for the Georgia font wherein
  • georgia.ttf is normal text
  • georgiab.ttf is bold text
  • georgiai.ttf is italic text
  • georgiaz.ttf is bold-italic text

Not all fonts have four associated files, but Georgia does.

Example 2: Custom font family

If you want to reference multiple fonts installed into the Sony PRS-600 root in a folder named fonts, then you would use this CSS:

Quote:
@font-face {
font-family: "MyFont";
font-weight: normal;
font-style: normal;
src: url(res:///Data/fonts/arlrdbd.ttf);
}

@font-face {
font-family: "MyFont";
font-weight: bold;
font-style: normal;
src: url(res:///Data/fonts/ariblk.ttf);
}

@font-face {
font-family: "MyFont";
font-weight: normal;
font-style: italic;
src: url(res:///Data/fonts/ariali.ttf);
}

@font-face {
font-family: "MyFont";
font-weight: bold;
font-style: italic;
src: url(res:///Data/fonts/segoeuiz.ttf);
}

body { font-family: "MyFont", sans serif; }
In this example MyFont font family uses Arial Rounded MT Bold, Arial, Arial Black, and Segoe UI fonts.

The following screenshots illustrate Example 1 and then Example 2 on my PRS-300:

...
Attached Thumbnails
Click image for larger version

Name:	Sony-Reader-Georgia-font.jpg
Views:	398
Size:	258.1 KB
ID:	52079   Click image for larger version

Name:	Sony-Reader-medium-font.jpg
Views:	370
Size:	256.3 KB
ID:	52080  

Last edited by jswinden; 05-22-2010 at 07:38 PM.
  Reply With Quote