└>Lesson 1: Where do I put CSS?
CSS can be placed into any HTML page, between the <head> and </head> tags. Alternativly, css can be placed into its very own file, which can then be referenced by any html page, this is the preferred way to use CSS for a full website, doing it like this means you only have to define the rules once, not on every single page. You can write a CSS file in any text editor, notepad works just fine, just save it with the extension ".css", not ".txt".
Embedding CSS into an HTML page
If you dont feel the need to seperate your CSS from your HTML file, you can place it in between the <head> and </head> tags. The code also needs to be enclosed between the <style type="text/css"> and </style> tags. here is a quick example:
<head>
<style type="text/css">
CSS CODE GOES HERE
</style>
</head>
You can also use css outside of the head tag, by adding the "style" attribute to an html tag. in a DIV tag for instance:
<div style="font-family:Arial; font-size:20px;">The text inside this div will be Arial at 20 pixels</div>
Linking to an external CSS file
This is the best way to use CSS in most cases, all you need to do is have your CSS code in its very own file. Lets assume you open notepad, write some code, and save it as "style.css" - I like to save my css files to a folder called css at the root of my website (mysite.com/css/), now edit the page that you want style.css to be applied to. To define what file we would like to use for our css, we need to use the <link> tag somewhere between the <head> and </head> tags. the href attribute of the link tag should point to your css file. Here is the example:
<head>
<link rel="stylesheet" type="text/css" href="/css/style.css" />
</head>
Now you can head on to Lesson 2 and learn the Syntax for CSS
