Css Cheat Sheet
This document was uploaded by user and they confirmed that they have the permission to share it. If you are author or own the copyright of this book, please report to us by using this DMCA report form. Report DMCA
Overview
Download & View Css Cheat Sheet as PDF for free.
More details
- Words: 414
- Pages: 1
css Selectors
Boxes
Box Model
*
All elements
div
div *
margin x
border-color x
margin-top
border-top-color
All elements within
margin-right
border-right-color
div span
<span> within
margin-bottom
border-bottom-color
div, span
Boxes
Box Model
*
All elements
div
div *
margin x
border-color x
margin-top
border-top-color
All elements within
margin-right
border-right-color
div span
<span> within
margin-bottom
border-bottom-color
div, span
and <span>
margin-left
border-left-color
div > span
<span> with parent
padding x
border-style x
div + span
<span> preceded by
padding-top
border-top-style
.class
Elements of class "class"
padding-right
border-right-style
div.class
margin-left
border-left-color
div > span
<span> with parent
padding x
border-style x
div + span
<span> preceded by
padding-top
border-top-style
.class
Elements of class "class"
padding-right
border-right-style
div.class
of class "class"
padding-bottom
border-bottom-style
#itemid
Element with id "itemid"
padding-left
border-left-style
div#itemid
padding-bottom
border-bottom-style
#itemid
Element with id "itemid"
padding-left
border-left-style
div#itemid
with id "itemid"
border x
border-width x
a[attr]
with attribute "attr"
border-top x
border-top-width
a[attr='x']
when "attr" is "x"
border-bottom x
border-right-width
a[class~='x']
when class is a list
border-right x
border-bottom-width
border-left x
border-left-width
containing 'x' a[lang|='en']
when lang begins "en"
Pseudo-Selectors and Pseudo-Classes
Margin
Visible Area
Height
Border
Width
Padding
Positioning display
clear
position
z-index
top
Tables
direction +
caption-side +
border-spacing +
:first-child
First child element
right
unicode-bidi
table-layout
empty-cells +
:first-line
First line of element
bottom
overflow
border-collapse +
speak-header +
:first-letter
First letter of element
left
clip
:hover
Element with mouse over
float
visibility
:active
Active element
:focus
Element with focus
:link
Unvisited links
:visited
Visited links
width
:lang(var)
Element with language "var"
:before :after
size
page-break-inside +
marks
page +
min-height
page-break-before
orphans +
min-width
max-height
page-break-after
widows +
Before element
max-width
vertical-align
After element
height
Dimensions
Interface
Sizes and Colours
Color / Background
0
color +
background-repeat
0 requires no unit
Relative Sizes em
Paging
background x
background-image
1em equal to font size of
background-color
background-position
parent (same as 100%)
background-attachment
ex
Height of lower case "x"
%
Percentage
Absolute Sizes px
Pixels
cm
Text
cursor +
outline-style
outline x
outline-color
outline-width Aural volume +
elevation
speak +
speech-rate
pause x
voice-family
word-spacing +
pause-before
pitch
Centimeters
text-indent + Text text-align +
text-transform +
pause-after
pitch-range
mm
Millimeters
text-decoration
white-space +
cue x
stress
in
Inches
text-shadow
line-height +
cue-before
richness
pt
1pt = 1/72in
letter-spacing +
cue-after
speak-punctuation
pc
1pc = 12pt
play-during
speak-numeral
Colours
azimuth +
Fonts
#789abc
RGB Hex Notation
#acf
Equates to "#aaccff"
font + x
font-weight +
rgb(0,25,50)
Value of each of red, green,
font-family +
font-stretch +
and blue. 0 to 255, may be
font-style +
font-size +
content
list-style-type +
swapped for percentages.
font-variant +
font-size-adjust +
quotes +
list-style-image +
counter-reset
list-style-position +
counter-increment
marker-offset
Note
Shorthand properties are marked x Properties that inherit are marked +
Available free from www.AddedBytes.com
Miscellaneous
list-style + x
border x
border-width x
a[attr]
with attribute "attr"
border-top x
border-top-width
a[attr='x']
when "attr" is "x"
border-bottom x
border-right-width
a[class~='x']
when class is a list
border-right x
border-bottom-width
border-left x
border-left-width
containing 'x' a[lang|='en']
when lang begins "en"
Pseudo-Selectors and Pseudo-Classes
Margin
Visible Area
Height
Border
Width
Padding
Positioning display
clear
position
z-index
top
Tables
direction +
caption-side +
border-spacing +
:first-child
First child element
right
unicode-bidi
table-layout
empty-cells +
:first-line
First line of element
bottom
overflow
border-collapse +
speak-header +
:first-letter
First letter of element
left
clip
:hover
Element with mouse over
float
visibility
:active
Active element
:focus
Element with focus
:link
Unvisited links
:visited
Visited links
width
:lang(var)
Element with language "var"
:before :after
size
page-break-inside +
marks
page +
min-height
page-break-before
orphans +
min-width
max-height
page-break-after
widows +
Before element
max-width
vertical-align
After element
height
Dimensions
Interface
Sizes and Colours
Color / Background
0
color +
background-repeat
0 requires no unit
Relative Sizes em
Paging
background x
background-image
1em equal to font size of
background-color
background-position
parent (same as 100%)
background-attachment
ex
Height of lower case "x"
%
Percentage
Absolute Sizes px
Pixels
cm
Text
cursor +
outline-style
outline x
outline-color
outline-width Aural volume +
elevation
speak +
speech-rate
pause x
voice-family
word-spacing +
pause-before
pitch
Centimeters
text-indent + Text text-align +
text-transform +
pause-after
pitch-range
mm
Millimeters
text-decoration
white-space +
cue x
stress
in
Inches
text-shadow
line-height +
cue-before
richness
pt
1pt = 1/72in
letter-spacing +
cue-after
speak-punctuation
pc
1pc = 12pt
play-during
speak-numeral
Colours
azimuth +
Fonts
#789abc
RGB Hex Notation
#acf
Equates to "#aaccff"
font + x
font-weight +
rgb(0,25,50)
Value of each of red, green,
font-family +
font-stretch +
and blue. 0 to 255, may be
font-style +
font-size +
content
list-style-type +
swapped for percentages.
font-variant +
font-size-adjust +
quotes +
list-style-image +
counter-reset
list-style-position +
counter-increment
marker-offset
Note
Shorthand properties are marked x Properties that inherit are marked +
Available free from www.AddedBytes.com
Miscellaneous
list-style + x
Related Documents
Css Cheat Sheet
August 2019 34
Css Cheat Sheet
April 2020 21
Css 2 Visual Cheat Sheet
June 2020 16
Blueprint Css Framework Version 0.8 Cheat Sheet
December 2019 29
Cheat Sheet
August 2019 52
Css Help Sheet
August 2019 29More Documents from "kangax"
Building A Web Site With Kompozer
June 2020 11
Installing Wine
June 2020 23
Learn To Play The Piano
April 2020 17
Jsp Tutorial
June 2020 11