
Study with the several resources on Docsity
Earn points by helping other students or get them with a premium plan
Prepare for your exams
Study with the several resources on Docsity
Earn points to download
Earn points by helping other students or get them with a premium plan
Very good cheat sheet on essential notions of the CSS programming language
Typology: Cheat Sheet
1 / 1
This page cannot be seen from the preview
Don't miss anything!

Boxes margin * margin-top margin-right margin-bottom margin-left
padding * padding-top padding-right padding-bottom padding-left
border * border-top * border-bottom * border-right * border-left *
border-color * border-top-color border-right-color border-bottom-color border-left-color
border-style * border-top-style border-right-style border-bottom-style border-left-style
border-width * border-top-width border-right-width border-bottom-width border-left-width
Positioning display position top right bottom left float clear z-index direction unicode-bidi overflow clip visibility
Dimensions width min-width max-width height min-height max-height line-height vertical-align
Miscellaneous content quotes counter-reset counter-increment marker-offset list-style * list-style-type list-style-image list-style-position
Shorthand properties are marked with *
Paging size marks page-break-before page-break-after page-break-inside page orphans widows
Color / Background color
Fonts
Text text-indent text-align text-decoration text-shadow letter-spacing word-spacing text-transform white-space
Tables caption-side table-layout border-collapse border-spacing empty-cells speak-header
Interface cursor
Aural volume speak
div div * div span div, span div > span
div + span
.class div.class #itemid div#itemid a[class] a[class='x'] a[class~='x']
a[lang|='en']
Styles apply to: All elements
Elements within within and with as parent preceded by ... Elements of class "class" of class "class" Element with id "itemid" with id "itemid" with class attribute when class is "x" when class is a list of space-seperated values and one of those is 'x' when lang begins with "en"
all braille embossed handheld print
projection screen speech tty tv
:first-child :first-line :first-letter :hover :active :focus :link
:visited :lang(lang)
Styles apply to: First child of element First line of element First letter of element Element when mouse over Active element Element with focus Non-active, unvisited links without mouse over. Visited links Element with text of language "lang"
px em
ex % in cm mm pt pc #789abc #acf rgb(0,25,50)
Pixels 1em equal to font size of parent (same as 100%) Height of lower case "x" Percentage Inches Centimeters Millimeters 1pt = 1/72in 1pc = 12pt RGB Hex Notation Equates to "#aaccff" Value (0 to 255) of each of red, green, and blue. May also be percentages 0 requires no unit
Width
Padding Margin
Visible Area
Height (^) Border
azimuth border-collapse border-spacing caption-side color cursor direction empty-cells font font-family font-stretch font-size font-size-adjust font-style font-variant font-weight letter-spacing line-height
list-style list-style-image list-style-position list-style-type orphans page page-break-inside quotes speak speak-header text-align text-indent text-transform volume white-space widows word-spacing
/* Comment */ @media type { selector { property: values; } } (^) (Media type optional)