Cascading Style Sheets

skip to content

CSS Basics

Classification of Elements

Block-level Elements

paragraphs, headings, lists, tables, DIVs, and Body. One block level per line, they force a new line.

Inline Elements

A, EM, SPAN,images and form inputs. Do not force a new line.

List Elements


Link Stylesheet

<link rel="stylesheet" TYPE="text/css" href="demo.css">
<style type="text/css" media="all">@import "demo.css";</style>
2nd example will be ignored by older browsers that generally dont support CSS(2)

Add a style

P {font-family:times;color:red;font-weight:bold;}
<p>text affected</p>

affected text

Add a class

.red {font-family:times;color:red;font-weight:bold;}
<span class="blue">text affected</span>
affected text

Add another class

.box {
	border:#369 1px solid;}
<div class="box">text affected</div>
text affected

Link styles with Pseudo-classes

	a.big {color:#000;font-size:22px;}
		a.big:hover {color:red;background:white;}
<a href="#" class="big">Test Link</a>
Test Link