AK Productions Studios :: Tutorials and Design Resources for Webmasters!

Welcome Guest!

CSS is useful for a whole range of things which we'll be covering only a few in this tutorial.
Author: Cana-Balistic
Difficulty: 2/10

A Beginners Guide to CSS

1. Make a new text file named "main.css" (make sure you can see file types).

2. Insert the following code between the <head> tags of your html code:

Note: if your going to be using more then one CSS file on your site it is wise to put them into a sub directory.

3. Open 'main.css' in notepad and input the following piece of code:

BODY {color: #D37A2A; margin: 0; Background: #fa43f6; bgproperties: fixed; }

What does this do?

Body denotes the body tag
Color: is the text color
Margin: is the page margin top & left
Background: is the background color (images are also acceptable)
BGProperites: set of properties for a background image (fixed simply means the image will stay static and will not move when you scroll down the page which can be useful for iFrames!

4. Input this code for link values:

A:link {text-decoration: underline; color: #D37A2A;} A:visited {text-decoration: none; color: #D37A2A;} A:hover {text-decoration: none; color: #D37A2A;}

Pretty much self explanatory.

5. The following is for id tags ie, <font id="header" color="#ffffff">

#header { font-family: Carolingia; font-face: Carolingia; font-style: normal; font-size: 50; font-weight: normal; src: url(fonts/CAROLIN0.eot); }

The above CSS code is for font embedding which will be covered in another tutorial but you may also set font size's and a few other things (color must be set in the font tag itself)