You can define a class and an id with the same code directly on your website. This would be referred to as an internal style sheet. Instead of linking to the style sheet from the head section or creating an entirely different file just for the css, you can use internal style sheets directly in your webpage code. The following example shows you how to place it in your website:
<head>
<title>Example of an Internal Style sheet </title>
<style type="text/css">
.redtext
{
font-weight: bold;
color: #f00;
}
</style>
</head>
As you may have noticed in the above example, the style sheet was placed inside the header section of the webpage.
Each way to insert a style sheet is great in its own way, but if you ask around, you will find that a great majority of webdesigners and programmers use external style sheets. External style sheets can be applied to multiple webpages, so if you ever want to edit a color attribute on three pages at once and they all use the same style sheet, then you'll just have to edit one thing rather than three separate things!
External style sheets can be used with inline styles; you can apply the same External style sheet to muliple pages and then go through the pages and make small adjustments for the individual pages using inline styles.
Internal style sheets can only be used with one page at a time. In order to edit it, you have to load up the rest of your page with the style sheet, so it would take a longer amount of time to make a small change.