The Basics of CSS
What is CSS?
CSS stands for Cascading Style Sheets.
A style defines how an HTML element is displayed.
Style information can be stored:
- In the header of a given HTML page (Internal Style)
- Within a given tag (Inline style)
- In a separate file which is then linked to the HTML page by a reference in the page header (External style)
Why use CSS?
A web page consists of two basic components - the Content (or information you wish to display) and the Style (the way if which you wish the content to be displayed).
CSS allows you to separate Content from Style. It's even possible to have more than one style sheet - thus allowing you to have more than one way of displaying a page.
If all of the style information is retained within one external style sheet, it is possible to edit that one file and make sweeping changes (such as changing background and/or text colours) that affect hundreds of related web pages without having to touch a single HTML file
You can define a style for any HTML element and apply it to as many Web pages as you want. To make a global change, simply change the style, and all relevant elements on every page are affected automatically.
Multiple Styles Cascade Into One
Since you can specify CSS information in a number of ways, it is possible to utilise all three CSS methods as required. When you do utilise more than one CSS methodology (eg. using both external and inline style on the one web page), the multiple styles will cascade. This means that they will merge together to form a complete 'virtual' set of style instructions.
Generally speaking, styles using the following rules in descending priority:
- Inline Style (inside HTML element)
- Internal Style Sheet (inside the <head> tag)
- External Style Sheet
- Browser default style
So, an inline style declaration has the highest priority and will override any declared internal or external style for the same HTML element and any default style properties normally applied by the browser.
