Types of Style Sheet
External Style Sheet.
An external style sheet is simply a text file containing a list of CSS. The file is saved with a .css extension and saved to any directory that can be accessed by the web pages using it. Unlike embedded style sheets, the CSS rules sets do not have to be wrapped in the <style>...</style> tags.
H1 { font-family: 'Times New Roman'; font-size: 36px; background: #ffffff; color: green; }
H2 { font-family: arial,verdana,sans-serif; font-size: 20px; background: #ffffff; color: red; }
P { font-family: arial,verdana,sans-serif; font-size: 16px; background: #ffffff; color: navy; }
Now all we have to do is save the above rule sets to a file called, say, main.css .
Internal Style Sheet.
Internal style sheets are styles that are placed in the <head> of the HTML document. These styles affect only the document they are in, and cannot be referenced by any other Web document.
<head>
<style type="text/css">
hr {color:pink}
p {margin-left1020px} body {background-image: url("images/home.gif")} </style> </head>
Inline Style Sheet
Inline styles can be applied to individual HTML tags within your Web page. This can be a good method to use if you are applying a different style to just one element on your site, but it should not be used across the whole of your site, since it is not much of an improvement over the old way of doing things.
<h1 style="color:red; font-family: arial,times,serif; font-size:15%;">This is my first text</h1>
Multiple Style Sheet
If some properties have been set for the same selector in different style sheets, the values will be inherited from the more specific style sheet.
For example, the following short CSS style sheet (stored in the file "special.css"), sets the text color of a paragraph to green and surrounds it with a solid red border:
p.special {
color : green;
border : solid red;
}