Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
214 views

CSS Cheatsheet

This document provides a cheat sheet for CSS syntax and properties. It includes sections on shorthand properties, comments, pseudo-classes, box model, text formatting, fonts, positioning, backgrounds, and lists. The cheat sheet defines common CSS selectors, properties, and values for layout, styling, and visual formatting of HTML elements.

Uploaded by

Alin-Mihai Bobeica
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
214 views

CSS Cheatsheet

This document provides a cheat sheet for CSS syntax and properties. It includes sections on shorthand properties, comments, pseudo-classes, box model, text formatting, fonts, positioning, backgrounds, and lists. The cheat sheet defines common CSS selectors, properties, and values for layout, styling, and visual formatting of HTML elements.

Uploaded by

Alin-Mihai Bobeica
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

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

You might also like