HTML and CSS Reference
In-Depth Information
To use the demo to explore kerning and tracking styles:
◗
1.
Open the
demo_css.htm
file from the tutorial.03/demo folder in your Web
browser.
The demo page contains a collection of CSS text styles. You can specify text style
values using the boxes on the left side of the demo. In the top-right box, you can
enter text to be displayed using the selected styles. The style as applied to the
sample text appears in the middle box. The CSS code for the style appears in the
bottom-right box. You press the Tab key to apply the style and view the results.
◗
2.
Click the top-right box, select and delete the text
Enter sample text here
, type
Sunny Acres
, press the
Enter
key, and then type
Corn Maze
on the second line.
Press the
Tab
key to display this text in the Preview box.
◗
3.
Select
sans-serif
from the font-family box.
◗
4.
In the font-size box, replace the default text with
2
, and then select
em
in the cor-
responding unit box.
◗
5.
Enter
0.3
in the letter-spacing box, and then select
em
in the corresponding unit
box. Press the
Tab
key.
◗
6.
Enter
0.8
in the word-spacing box and then select
em
in the corresponding unit
box. Press the
Tab
key. Figure 3-30 shows the revised appearance of the text after
applying the letter-spacing and word-spacing styles.
Figure 3-30
Using the demo page to explore letter-spacing and word-spacing
style
v
alues
CSS st
y
le rule
preview pane
◗
7.
Experiment with other letter-spacing and word-spacing style values to see their
effects on kerning and tracking.