Using Cascading Style Sheet As you create more web pages, you may wish to impose a consistent look for all of your web pages or for group of related pages. It is tedious to insert elements for all the characteristics you may wish to replicate – font size, font color, background color, and so forth. Style sheet makes it much easier to replicate layout information in multiple documents. There are two ways to link style sheet with a document. 1)Internal Style Sheet 2)External Style Sheet Internal Style Sheet HTML Example body.bright {background:red; font: 16pt serif} Style Sheet Here is the body

Using Cascading StyleSheet The Style Element has an optional title attribute and a type attribute set equal to “text/css”, where the CSS stands for cascading style sheet. This style element gives the body style a name (bright) and sets the document background color to red and the default font to bold. Note the use of the dot notation to assign a class name to the style rule(s) established for the element, and the use of the name later (class=“bright”) with the class attribute in the tag. Each style rule is terminated with a semicolon. When multiple properties are set for the same element, they are enclosed in curly brackets. Background Properties Background-color When used in body element, background-color sets the background color for an entire document. It can also be used to highlight a paragraph, when used with a P element.

Using Cascading StyleSheet Background-image This property is used with a URL to select an image file (gif or.jpeg) that will appear as a background. Typically, this is used with a body element. But it can also be used with other elements, such as p. Font-Family Font support is not completely standardised. However browsers that support style Sheets should support at least the generic fonts such as cursive, monospace, sans-serif, serif. Font-Size This property allows you to set the actual or relative size of the text. You can use relative values, such as large, small, larger, smaller, a percentage such as 200% of the default size, or an actual point size such as 16pts. Font-style This property allows you to specify normal, italic, or oblique fonts.

Using Cascading StyleSheet Text-align This is used in block elements such as p. It is similar in effect to the HTML align Document: body.css Body { background:silver; color:white; font:24pts Times} H1 {color:red; font: 18pts Impact;} H2 { color:blue; font:16pt Courier} Document: Style2.html Style Sheet Examples Heading 1 Heading 2 Here is some text