1. Here are four ways to attach a style to your text: A. You can specify a style for any element, as is usually done for older
browsers. For example, you can type for each paragraph: <p><font-face="Arial, Helvetica, sans-serif"> to make sure the paragraph or other selected text is displayed in that style. B. You can embed a style sheet in between the <head> and </head> tags. To make sure the style sheet is not displayed by older browsers, type the style definitions between <!-- comment lines -->. After your doctype declaration and <html> tag the structure would be: <head> C. You can attach an external style sheet to your document. You create the separate style sheet as a document with a .css extension and store it on your site. In between the <head> and </head> tags of your document you link to the style sheet by typing: <link rel=stylesheet href=stylefile.css type="text/css"> where "stylefile" is the name of the style sheet with its .css extension. Note that the "text/css" must be within quotation marks. This one line takes care of the entire page. D. You can import a style sheet from another location by typing the link in between the heads as: @import "http://www.nameofstylefile.css" where "nameof stylefile" is the file name on the site where the stylesheet is stored. The ability to do this will someday mean that people can create and offer a complete stylized look for a page. Web designers will be able to simply link to the style sheet kept somewhere on the web. 2. You specify font-family so that if a computer does not have the font you have chosen it can fall back to an alternative. Most PCs display their sans-serif font as "Arial" while Macs use "Helvetica". So it is important to always name both. |
|
|||
3. The "em" refers to the height of the element's font. This is useful since you can specify other font sizes relative to the basic font size. For example, if you set the font size for p tags as 10pt you can define the h1 tag as 2em. W3C recommends using relative units like this so that they adjust to the variety of monitors. For more information about "em" see "Understanding Em" by Daniel Will-Harris at Web Review. 4. The "line-height" controls what is typographers call "leading", the space in between lines. This is the measure from the bottom of one line to the bottom of the next. Like the font-size, this can be done with absolute or relative values. It is good to have a generous line-height for text on the web. Style sheets enable you to have a 150% line-height like this page, for example. The default for most browsers is more like 120%. |
Copyright by dwang, 1999. All rights reserved.