CSS stands for Cascading Style Sheets. It deals with the presentation of a web site (what it looks like). It is always used in combination with HTML (the structure of the site). Essentially, it is the separation of style (CSS) and content (HTML + other languages), replacing HTML tag attributes.


Using CSS:



-an element (in a document) is a CONTAINER, bounded by start and end tags.

‘p’ designates a paragraph container. Everything between its start 'p' and end '/p' tag is its content.

HTML Structures:


The ‘div’ element creates a containment shaped like a block that begins at the starting point of one line and ends with a line break.


The ‘span’ element is an inline container, meaning that it is surrounded by chunks of running text.

Block-level elements:

A self-contained unit of content like a box; starting at the margin of one line and forcing the next bit of content to begin on a new line.

Common block-level elements are: p, ul, ol, li, and div.

A box, or block-level element has a position, a dimension, a border, margins, and padding. These can be set using CSS. The width and height of the box is the sum of the element content, plus padding, borders and margins. If they are not defined they will be zero by default and therefore contribute nothing to the dimensions of the box.

HTML Structures:

Class Selectors:

-an identifier used to assign a style to a subset of elements in a document.


ID selectors:

-an identifier used to assign a style to only one element in the entire document.


Descendant selectors:

-an identifier used to assign styles to specific categories of elements.


Embedding Style Sheets:

-In-document styles:

The 'style' tag, style attributes are in the 'head' tag.


Style attribute within the element tag:


-External style sheets


download files: