Thomas Wallace

Lectures and Resources

Creating and Attaching a Stylesheet

There are several different ways we can attach a style to a document. CSS can be included in any document by creating selectors inside a block code that looks like so…

<style>
selector {
property:value;
}
</style>

 

While this method will work, it is not advisable as it blends presentational information inside your html document. This makes code maintenance difficult and removes your ability make global changes to site appearance.

The method that it more maintainable and inline with industry standards, is to include all CSS in a separate file that is then linked to each of you html documents. To do this follow these steps:

  1. In your IDE (Cloud9 / Brackets) create a new file.
  2. Save the file in your css directory naming it style.css. This folder should be located inside your assets directory.
  3. In the head section of your html document add the following code:
<link rel="stylesheet" href="assets/css/style.css" />

At this point you should be able to begin writing css selectors in the style.css document and have them applied to your page. If you are having issues check to make sure your filename and paths are correct.