CGI Scripts that are Very Secure, Reliable & Free! 

Cascading Style Sheets (css)

Css stands for cascading style sheets. Css are a collection of formatting rules which control the layout and design of your webpage. Css allows you to have great control over the exact appearance of the webpage.

Css styles allow you to control your webpage much better than using HTML alone. You can set things such as bullet points in pixel sizes, ensuring greater consistency across the site whichever browser your visitor is using.Css is very useful when it comes to updating your webpage. You simply change the text style, colour etc once and it changes across all your pages, instead of having to go to each page and update it individually.To insert Css into a Dreamweaver application, go to Window => Css Style. In the top right of the screen, the Apply styles and Edit styles allow you to you select different views of the CSS styles associated with the current document. You use the Apply Styles to select a class style that you want to apply to the document. You then insert the document that you want to appear on the various pages. To do this, click the fourth button from the left at the bottom of the Css Styles panel and insert the location of the relevant document.Each css rule consists of two parts;
1. a selector that defines the HTML element(s) to which the rule applies, and
2. a collection of one or more properties, which describes the appearance of all elements in the document that match the selector.

h1 {
colour: red;
font-size:large;
}

The selector, h1, means that this rule applies to h1 headings in the document. (Headings are explained above.) All headings will be large and red.

You can select all paragraphs in the document to be included using the selector, p.

p {
font-size: 15 pixels;
colour: black

This means that all the font in the paragraph will be set at 15 pixels, and will all be green.

The commonest and most easy way to insert Css into your webpage is to have it embedded into the head of the document's HTML.

<style type="text/css">
<!--
h1, h2 {
color: green;
}
h3 {
color: blue;
}
-->
</style>

The css rules apply to all the designated parts of the webpage. Here, headings 1 (h1) and heading 2 (h2) are green and heading 3 (h3) is blue. This will be throughout the document, yet the HTML has had to be entered only once.

Server Side Includes (previous) | Web Design Guide (home) | Making your site Great! (next)