liquidicity

CSS Help Sheet.

Syntax This Needs a Diagram
height width height; width; margin-top; margin-right; margin-bottom; margin-left; padding-top; padding-right; padding-bottom; padding-left;

Shorthand
background border border-bottom border-left border-right border-top font list-style margin padding

Syntax
selector {property: value;}

External Style Sheet

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

Internal Style
<style type=text/css> selector {property: value} </style> border margin padding

Inline Style
<tag style=property: value>

Border
border-width Width of the border border-style dashed; dotted; double; groove; inset; outset; ridge; solid; none; border-color Colour of the border

Comments
/* Comments */

General
class ID div span color cursor display over ow String preceded by a full stop [.] String preceded by a hash [#] Formats structure or block of text Inline formatting Foreground colour Appearance of the cursor block; inline; list-item; none How to handle content that over ows its box. visible, hidden, scroll, auto visible, hidden

Pseudo Selectors
:hover :active :focus :link :visited : rst-line : rst-letter

Position
clear oat left top position If any oating elements around the element both, left, right, none Floats to a speci ed side left, right, none The left position of an element auto, length values [pt, in, cm, px] The top position of an element auto, length values [pt, in, cm, px] static, relative, absolute Above or below overlapping elements auto, integer [higher numbers on top]

Media Types
all braille embossed handheld print projection screen speech tty tv

visibility

Font
font-style italic, normal fontnormal, small-caps variant fontweight font-size bold, normal, lighter, bolder, integer [100-900] Size of the font

z-index

Background
background-color Colour of background background-image Background image background-repeat repeat, no-repeat, repeat-x, repeat-y backgroundattachment Background image scrolls with element scroll, xed (x y), top, center, bottom, left, right

Units
Length % em pt px Keywords bolder lighter larger

font-family Speci c font[s] to be used.

Text
letter-spacing line-height text-align textdecoration text-indent texttransform vertical-align word-spacing Space between letters Vertical space between baselines Horizontal alignment blink, line-through, none, overline, underline First line indentation capitalise, lowercase, uppercase Vertical alignment Spacing between words

backgroundposition

List
list-styletype list-styleposition list-styleimage Type of bullet or numbering in the list disc; circle; square; decimal; lower-roman; upper-roman; lower-alpha; upper-alpha; none Position of the bullet or number in a list inside; outside Image to be used as the bullet in the list

2007 Go Squared Ltd.