Sample HTML & CSS with external style sheet

The following is an example HTML page that links to a separate stylesheet, styles.css. The CSS source is given below the HTML.

HTML

<!DOCTYPE html>
<html>
<head>
  <title>Sample CSS page</title>
  <link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
  <div id="container">
    <div class="centered">
      <h2>This is a sample page using a linked stylesheet</h2>
    </div>
    <p>The <a href="http://www.w3schools.com/css/" target="_blank">CSS Tutoral</a> at <a href="http://www.w3schools.com/" target="_blank">W3 Schools</a> has great information about using stylesheets and CSS.</p>
  </div>
</body>
</html>

styles.css:

body {
  /* This is a comment.
  Make the background dark grey and the foreground color white */
  background: #222;
  color: #bbb;
}

/* This will style the div element with id="container" */
div#container {
  /* Fix the width and center within the outer block (probably body) */
  width: 800px;
  margin: 0 auto; 
}

/* Style any div elements with class="centered" */
div.centered {
  text-align: center;
  padding: 20px;  
}

/* Anchor tags (hyperlinks): change color and remove text decoration.
Use the same style whether the link has been visited or not */
a, a:visited  {
  text-decoration: none;
  color: #04f;
}

/* Brigher text when hovering over links */
a:hover {
  color: #fff;  
}