The purpose of CSS is to provide webmasters more control over page layout and display than HTML offers. With HTML alone, there are various coding tricks that are used to help achieve the desired page layout. The trouble with that is those tricks often don't work the same, if at all, in all browsers. CSS standards were designed so that these tricks are no longer needed, so CSS is much more predictable and reliable than resorting to those old tricks.
Using a wall of your house for a loose analogy, HTML is the studding behind the wall; and CSS is the wall covering, colors, and placement of the content on the wall. In other words, when properly used, HTML defines the structure of your web page while CSS defines the appearance.
Aside from consistent display standards, one of the greatest benefits of using CSS is if you use external style sheets, you can make one change to the style sheet and have that change take place throughout your entire web site.
Here are just a few things that you can do with CSS that can't be done in HTML alone without resorting to quirky tricks that don't work the same in all browsers:
* Set different page margins for all sides of your page.
* Set font size for any text element to the exact height you want, no more preset size limitations.
* You can highlight single words, entire paragraphs, headings or even individual LETTERS with different background colors, background images, text colors and fonts if you really want to go crazy bananas.
* You can overlap words and make logo-type headers without making images.
* Colored scrollbars! Note: colored scrollbars are NOT official CSS, they are a Microsoft extension to CSS so using colored
s crollbars is technically an illegal code practice, but it doesn't cause any harm if you like them. Colored scrollbars also only work in Internet Explorer.
* Precise positioning of elements.
* Borders, border styles, backgrounds, margins, and padding can be set for any visual HTML element.
* Set the font for whole tables, no need to recode a font into each table cell.
* Make the first letter of each paragraph different, set letter spacing, change the space between lines of text, and much, MUCH MORE!