An Introduction to Style Sheets: Text Styles
|
|
An Introduction to Style Sheets: Text Styles |
|
Not every effect will be visible in every browser.
Unlike the three previous pages, almost all the attributes on this page are called "text" attributes because their names start with "text," and not "font." There is one font attribute left which fits best on this page instead of on the earlier ones.
The font-variant element has two values: normal, small-caps. If you have used this font variant in a word processor you know exactly what will happen. You may also be aware that some typefaces have a Small Caps font and others do not. If your browser recognizes this attribute it will use the Small Caps characters if they exist. Otherwise it will convert the normal type into something approximating a Small Caps font.
What do you see in this paragraph?
If your browser is like most, what you will see is a sentence with all the letters capitalised. Unfortunately browsers do not reconize the Small Caps variant, (yet). The next two attributes are recognized by at least some browsers. The first one, text-transform , saves some typing but otherwise does not seem too useful to me at the moment.
text-transform |
|
| Value | Effect |
|---|---|
| capitalize | each word should be capitalized |
| uppercase | each letter should be uppercase |
| lowercase | EACH LETTER SHOULD BE LOWERCASE |
text-decoration , on the other hand, is used regularly on many sites. Unfortunately not every effect is supported by every browser.
text-decoration |
|
| Value | Effect |
|---|---|
| underline | Underlines every character including spaces. |
| overline | Puts a line over every character including spaces. |
| line-through | Puts a line through every character, including spaces. |
| blink | Makes the text blink. This is very annoying. |
| none | Neutralizes any other text-decoration. Used to eliminate underlines in links. |
We finish our examination of text controls with two pages about typographical controls, some of the attributes that affect vertical and horizontal positioning of text.
Font Family | Font Size | Font Style | Text Style | Vertical Spacing | Horizontal Spacing
| Other Possibilities | |
|---|---|
| Start of site | Style Sheet Home |
| Send email | Robert Boardman |