What are Style Sheets?

How do they work with
Dreamweaver?

How do they work with
HTML?

 
 
What are Style Sheets?

Style Sheets are an addition to the HTML code of a website that lets you set specific design properties to blocks of your website or specefic HTML tags of your website.

For example, if you would like all links in your website to appear without underlining, you could create a style sheet to redefine the link (<a>) to be formatted without underlining and apply it to all pages on your site.

Also, if you wanted all the body text on your site to be formatted in 12 pt Bold Arial font, you would create a style with these properties in a style sheet, and apply that style to the body portions of each page.


Why are Style Sheets Useful?

Style sheets allow more control over visible elements of a web site. For example, style sheets can distinguish between a link, and a link with the mouse hovering over it.

Also, style sheets offer better positioning functionality such as absolute and relative positioning on a site and z-positioning. These allow you to place elements almost anywhere on the page and stack them with z-positioning so one will appear above another.

Additionally, style sheets can redefine HTML tags so you can explicitly set all links to not have underlining, or every h3 heading to be a size of our choosing.

Finally, style sheets can be linked from an external file, allowing you to create a site-wide style. So if you wanted to create a standard style for all the body text on your site, you would create the style in a separate external file and link it to every page. Later, if you wanted to change this style, you could simply change the one file, and the effect would be visible throughout every page on your site.

 
  International Multimedia Resource Center
610-578-6134 - 470 Maginnes Hall
Designed by:
Tom Schaible
Johanna Brams, Project Manager