Lesson 3: XHTML Coding Objectives: Demonstrate knowledge of ...

HTML 4.01 and XHTML 1.0 both require that you use CSS to create the layout and
formatting of your page.
Before using a CSS you should learn the terminology.
o There are four basic parts of a CSS rule:
Selector – any element that you want to effect.
Declaration – this part of a CSS rule is made up of the property and
value enclosed in curly brackets.
Property – this is what are you going to change about the selector.
Value - this is the color or size that you are changing the particular
selector to.
Example rule: body {background: tan}
Proper CSS Structure
o A properly coded CSS rule should look similar to the one below.
body {
font-family: arial, verdana, helvetica; color: gray:
}
o Notice that the curly brackets are on separate lines and that the declaration
is indented. This is considered good coding practice.
o To ignore a rule in a style sheet you can comment it out. To do this place a
/* before the rule and a */ after the rule.
Example: /*body {background: tan}*/
Inheritance
o Inheritance is an essential concept of Cascading Style Sheets.
o The term cascading refers to inheritance.
o The styles for your CSS will cascade to the pages that are linked to it.
o The rules in the style sheet will override attributes like bgcolor.
CSS Facts
There are four ways to apply a CSS styles:
o Declare an inline style
o Create an embedded style sheet
o Link to an external style sheet
o Use an imported style sheet - imported style sheets have been known to
cause problems… certain older browsers crash when rendering pages with
imported style sheets.
Benefits of using a CSS
o Consistency – Using a CSS makes it easy to have a consistent look and
feel to your site.
o Easy change management – When you need to change the color of a
heading style you only have to change it on the style sheet. If you didn’t
use a style sheet you would have to search for every occurrence of the
heading style and change them one by one.