Setting up a stylesheet

August 10th, 2008

Css | Cascading Style Sheets

My post changing font color with css is getting quite a few hits, but it assumes a certain level of knowledge.
So here I will show you how to set up your style sheet.

Create index

Save document with meta information as shown, as index with .htm as the file extension.
You have your index.htm
within the head section you find the meta information.

<head> 

<title>MadLayout</title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<meta name="author" content="Paul David Spencer" />
<meta name="description" content="What we do"/>
<meta name="keywords" content="Design, CSS, Standards."/>

<link href="style.css" rel="stylesheet" type="text/css" />

</head>

<body>

</body>

</html>

The highlighted part is where you need to make the link to the stylesheet.
I have called it style.css, but call it anything you will remember.

Create the stylesheet

Open your text editor and save empty page as style, (or whatever you chose) with .css as the extension, thus saving it as a css document.
Once saved you can check your link is working, by adding styles for the body of your index document.

body {
margin: 0;
padding: 0;
background-color:#8b0000; }

Place index.htm and style.css in the same directory, test index in browser, and if your page background colour changes accordingly you are set, Ha ha.

Css Layout
Css Popup
Css Change font colour

Entry Filed under: CSS Reaction