Basics of using CSS

2 Ways To Use

To use a separate file that contains your CSS:

<LINK href="training.css" rel="stylesheet" type="text/css">

To not use a separate file but instead but CSS in your page:

<style type="text/css">

a:active { text-decoration:none }

a:link { text-decoration:none }

a:visited { text-decoration:none }

a:hover { text-decoration:underline }


To make a comment:

/*This is a comment*/

To reference an ID tag use a #:

#menu {color:white}

<div id="menu">

Or subparts:

#menu p {color:white}

To reference a class:

.glossymenu {

list-style-type: none;

margin: 5px 0;

padding: 0;

width: 170px;

border: 1px solid #9A9A9A;

border-bottom-width: 0;


<div class="glossymenu">

To reference a table ID:

table#example { }

<table id="example">

To reference major portions of a page/site:

body { }

h3 { }

h2 { }

h1 { }

To make rounded corners:

-moz-border-radius: 15px 0px 0px 0px;

border-radius: 15px 15px 0px 0px;

To center a <div> on a page:

body { text-align:center}

Your inner div:

text-align: left;

width: 700px;

margin: 0 auto;

Miscellaneous common steps:

To fix issue where container div doesn't go all the way down on page:

<div style="clear:both;"></div>

To remove blue border around image with a link:

img {border-style:none;}


More info on CSS classes and ids

CSS and tables

Great website on CSS div positioning