CSS Reference

An extensive CSS reference with all the important properties and info to learn CSS from the basics

• Pseudo-class
• Property
• Function
• Data Type
• Concept
• @rule

Pseudo-class

• ::after
• ::before
• ::first-letter
• ::first-line
• ::placeholder
• ::selection
• :active
• :blank
• :checked
• :default
• :dir()
• :disabled
• :empty
• :enabled
• :first
• :first-child
• :first-of-type
• :focus
• :fullscreen
• :hover
• :in-range
• :indeterminate
• :invalid
• :lang()
• :last-child
• :last-of-type
• :left
• :link
• :not()
• :nth-child()
• :nth-last-child()
• :nth-last-of-type()
• :nth-of-type()
• :only-child
• :only-of-type
• :optional
• :out-of-range
• :read-only
• :read-write
• :required
• :right
• :root
• :scope
• :target
• :valid
• :visited
• content

Back to the top

Property

• animation
• animation-delay
• animation-direction
• animation-duration
• animation-fill-mode
• animation-iteration-count
• animation-name
• animation-play-state
• animation-timing-function
• backface-visibility
• background
• background-attachment
• background-blend-mode
• background-clip
• background-color
• background-image
• background-origin
• background-position
• background-repeat
• background-size
• border
• border-bottom
• border-bottom-color
• border-bottom-left-radius
• border-bottom-right-radius
• border-bottom-style
• border-bottom-width
• border-collapse
• border-color
• border-image
• border-image-outset
• border-image-repeat
• border-image-slice
• border-image-source
• border-image-width
• border-left
• border-left-color
• border-left-style
• border-left-width
• border-radius
• border-right
• border-right-color
• border-right-style
• border-right-width
• border-spacing
• border-style
• border-top
• border-top-color
• border-top-left-radius
• border-top-right-radius
• border-top-style
• border-top-width
• border-width
• bottom
• box-shadow
• box-sizing
• break-after
• break-before
• break-inside
• caption-side
• clear
• clip
• clip-path
• color
• column-count
• column-fill
• column-gap
• column-rule
• column-rule-color
• column-rule-style
• column-rule-width
• column-span
• column-width
• columns
• counter-increment
• counter-reset
• cursor
• direction
• display
• empty-cells
• filter
• float
• font
• font-family
• font-size
• font-size-adjust
• font-stretch
• font-style
• font-synthesis
• font-variant
• font-weight
• hanging-punctuation
• height
• hyphens
• isolation
• left
• letter-spacing
• line-height
• list-style
• list-style-image
• list-style-position
• list-style-type
• margin
• margin-bottom
• margin-left
• margin-right
• margin-top
• mask
• mask-border
• mask-border-mode
• mask-border-outset
• mask-border-repeat
• mask-border-slice
• mask-border-source
• mask-border-width
• mask-clip
• mask-composite
• mask-image
• mask-mode
• mask-origin
• mask-position
• mask-repeat
• mask-size
• mask-type
• max-height
• max-width
• min-height
• min-width
• mix-blend-mode
• object-fit
• object-position
• opacity
• orphans
• outline
• outline-color
• outline-offset
• outline-style
• outline-width
• overflow
• overflow-x
• overflow-y
• padding
• padding-bottom
• padding-left
• padding-right
• padding-top
• page-break-after
• page-break-before
• page-break-inside
• perspective
• perspective-origin
• pointer-events
• position
• quotes
• resize
• right
• shape-image-threshold
• shape-margin
• shape-outside
• tab-size
• table-layout
• text-align
• text-align-last
• text-decoration
• text-decoration-color
• text-decoration-line
• text-decoration-style
• text-indent
• text-justify
• text-overflow
• text-rendering
• text-shadow
• text-transform
• top
• transform
• transform-origin
• transform-style
• transition
• transition-delay
• transition-duration
• transition-property
• transition-timing-function
• unicode-bidi
• vertical-align
• visibility
• white-space
• widows
• width
• will-change
• word-break
• word-spacing
• word-wrap
• z-index

Back to the top

Function

• attr()
• calc()
• circle()
• ellipse()
• hsl()
• hsla()
• inset()
• linear-gradient()
• matrix()
• matrix3d()
• polygon()
• radial-gradient()
• repeating-linear-gradient()
• repeating-radial-gradient()
• rgb()
• rgba()
• rotate()
• rotate3d()
• rotateX()
• rotateY()
• rotateZ()
• scale()
• scale3d()
• scaleX()
• scaleY()
• scaleZ()
• skew()
• skewX()
• skewY()
• translate()
• translate3d()
• translateX()
• translateY()
• translateZ()

Back to the top

Data Type

• <angle>
• <basic-shape>
• <blend-mode>
• <color>
• <frequency>
• <gradient>
• <image>
• <integer>
• <length>
• <number>
• <percentage>
• <position>
• <ratio>
• <resolution>
• <string>
• <time>
• <timing-function>
• <url>
• <user-ident>
• inherit
• initial

Back to the top

Concept

• Counters
• Flexbox

Back to the top

@rule

• @charset
• @document
• @font-face
• @import
• @keyframes
• @media
• @namespace
• @page
• @supports

Copyright : http://tympanus.net/codrops/css_reference