
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>About CSS</title>
    
   <style type="text/css">
        body {
            min-width:750px;
            text-align:center;
            background-color:#CCCCCC;
        }
        
        #main-wrapper {
            margin-left:auto;
            margin-right:auto;
            width:750px;
            text-align:left;
            border:1px solid #000000;
            padding:10px;
            background-color:#FFFFFF;
        }
        
        h1 {
            color:#555555;
        }
        
        h2 {
            color:#555555;
        }
        
        p {
            color:#777777;
        }
    </style>
   
</head>

<body>
    <div id="main-wrapper">
       
        <h1>About CSS</h1>
        
        <p>Cascading Style Sheets, or CSS, is a stylesheet language that adds style to HTML pages.</p>

        <h2>Benefits</h2>
        <p>You can use CSS to style an entire website from only one place in your code, no matter how many pages that site might be. For example, you can change the color of all the headings in only one place, rather than editing 10 pages.</p>
        
        <h2>How to Apply CSS</h2>
        <p>There are two methods of applying CSS to an HTML page, one is on the same page and one is in an external file. Styles that are applied on the same page are called EMBEDDED STYLES and the ones that are on a separate file are called EXTERNAL STYLESHEETS.</p>
        
        <h2>External Stylesheets vs. Embedded Styles</h2>
        <p>Embedded styles are good for a simple single-page example like this one, but if you want to style a whole website you should use external stylesheets. If you had blocks of embedded styles on every page of your website, you would then have to edit many pages in order to change a simple color (defeating the purpose of the stylesheet!) but if you have the styles on an external stylesheet, you will have to edit it in only one place.</p>

   </div>
</body>
</html>