Traditionally web pages were made only from HTML. So the programmer would tell the browser (using HTML) that there is to be an image at the top with a border, followed by some text below it.
<img src="images/my_image.jpg" alt="My Image" border="1" /><br />
<p>Some text here</p>
Great stuff. But imagine this is on every page of a 3,000 page website. One day, you decide the image would look better with a 2 pixel border. Crap. That’s easily a day’s work going through and changing the alignment. This is why CSS was created.

Using CSS you could give the image a class:
<img src="images/my_image.jpg" alt="My Image" class="my_class" />
This class can then be reference in your Casecading Style Sheet (CSS), allowing you to set styles in your style sheet…

.my_class{
border:2px solid #000;
}


So, to change the image’s appearence on the whole site, you now only need the one change.

To include a CSS file into a HTML document you just need to do:
<link href="my_stylesheet.css" rel="stylesheet" type="text/css" />

Easy!