Understanding the Benefits of CSS

Since the release of HTML 4.0, the majority of websites use Cascading Style Sheets, or CSS.  CSS allows the website designer to control the formatting of text for the entire site with one element, instead of having to change the text format on every page.  While it is considered a more advanced tool, it allows for more customization and is used by all major web browsers. 

CSS can be used in three different ways:

• External Style Sheet - This will effect all pages on your website and includes using an external file that each web page will read to format the page.  For example if you have a website that all headers will be 24px in size, you can create an External Style Sheet that makes all <h1> tags on your website 24px without changing each one manually.
• Internal Style Sheet -This will change the style on one individual web page and will also go in the header of your web page.  If you have a type of formatting that you want to use on a certain page, but not the rest of the website, then you would use an Internal Style Sheet.
• Inline Styles -This will affect only one section or element on a page.  If you want to format one paragraph a different way then the rest of the paragraphs on the page, you can use an Inline Style to create a style sheet only for that element.

With this in the head of the page, all h1 tags on that page will be blue, h2 tags will be red, and all text within the paragraph tags will be green.  The advantage to CSS is if down the road you decide that you want all the text black, you can change just one file to effect all pages that use that style sheet.  This not only saves time but also makes your code cleaner since each individual paragraph and header will not need to specify the style.  Continue reading in this class for more information to assist in implementing CSS on your website and for examples.