www.link-academy.
com
CSS CHEAT SHEET
Shorthand
background
border
border-bottom
border-left
border-right
border-top
font
list-style
margin
padding
Comments
/* Comment */
Pseudo Selectors
:hover
:active
:focus
:link
:visited
SYNTAX
BOX MODEL
Syntax
selector {property: value;}
External
<link rel="stylesheet" type="text/css" href="style.css" />
Internal
<style type="text/css">
selector {property: value;}
</style>
Inline Style
<tag style="property: value">
margin
GENERAL
Class
ID
div
span
color
cursor
display
String preceded by a period /.
String preceded by a hash mark / #
Formats structure or block of text
Inline formatting
Foreground color
Appearance of the cursor
block; inline; list-item; none
overflow
How content overflowing its box is handled
visible, hidden, scroll, auto
visible, hidden
visibility
FONT
Media Types
all
braille
embossed
handheld
print
projection
screen
speech
tty
tv
Units
%
em
pt
px
font-style
font-variant
font-weight
font-size
font-family
Italic, normal
normal, small-caps
bold, normal, lighter, bolder, brojana vrednost (100-900)
Size of the font
Specific font(s) to be used
TEXT
letter-spacing
line-height
text-align
text-decoration
text-indent
text-transform
vertical-align
word-spacing
Space between letters
Vertical distance between baselines
Horizontal alignment
blink, line-through, none, overline, underline
First line indentation
capitalize, lowercase, uppercase
Vertical alignment
Spacing between words
height; width;
border
padding
75 x 25 px
margin-top; margin-right;
margin-bottom; margin-left;
padding-top; padding-right;
padding-bottom; padding-left;
BORDER
border-width
border-style
border-color
Width of the border
dashed; dotted; double; groove; inset; outset; ridge; solid; none
Color of the border
POSITION
clear
float
left
top
position
z-index
Any floating elements around the element | both, left, right, none
Floats to a specified side | left, right, none
The left position of an element | auto, length values (pt, in, cm, px)
The top position of an element | auto, vrednost (pt, in, cm, px)
static, relative, absolute
Element above or below overlapping elements
auto, integer (higher numbers on top)
BACKGROUND
background-color
background-image
background-repeat
background-attachment
Background color
Background image
repeat, no-repeat, repeat-x, repeat-y
Background image scroll with the element?
background-position
(x y), top, center, bottom, left, right
LIST
list-style-type
Type of bullet or numbering in the list
disc; circle; square; decimal; lower-roman; upper-roman;
lower-alpha; upper-alpha; none
list-style-position Position of the bullet or number in a list
inside; outside
list-style-image
Image to be used as the bullet in a list