The third chapter, entitled "Adding Some Style," begins with an over veiw of the different ways one can change how a website looks. The first and most primative method is by adding inline styles.
This paragraph is an example of an Inline Style. See how the text in this paragraph is green? That is the result of the inline style I added within the paragraph tag.
The next element useful in website design and the next tool on the design eshalon is the span element. This element allows the web developer to determine exactly where a certain style will have effect. This method is more powerful than Inline Style because it is more specific. For example, instead of being limited to coloring one paragraph, I was able to color and italisize only the word "style" in this paragraph. The span element could also be used to encompass several paragraphs at a time. This is much easier than including an Inline Style within every single paragraph tag.
Now up until this point all the tools we have studied embed style within each individual web page. The most powerful style tool, however, is totally separate of individual html sheets. External style sheets allow web developers to design a standard webpage that will apply to every page of a site.
One type of external style sheet is the cascading style sheet or CSS. CSS is a separate page of markup that is then linked to the actual website pages. This page is linked to a css sheet which changed everything within the h2 element a san-serif, with Verdana as the first choice. See how the heading "Inline Style" is different from the heading "Chapter 3 Proof?" Other changes that CSS can effect are line height, padding, background color. As you can see these changes have been applied to this page as well.
Several of the other things that can be controled from a stye sheet are distinguishing between visited and nonvisited links, class selectors that can change specific elements, such as a class selector has changed the color and font of this sections header,
3/28/08 6:53 AM