
This is a complete reference guide for web developers where we have listed all the CSS properties defined in the World Wide Web Consortium's Recommended Specification for Cascading Style Sheets, Level 2.
Click any property to see its description with examples −
| Sr.No. | Property & Description | 
|---|---|
| 1 | azimuth
 Describes the position of a sound source along the horizontal axis of the listener's environment.  | 
| 2 | background
 Composite property for the following properties − 
  | 
| 3 | background-attachment
 Determines if the background image is fixed in the window or scrolls as the document scrolls.  | 
| 4 | background-color
 Sets the background color of an element.  | 
| 5 | background-image
 Sets the background image of an element.  | 
| 6 | background-position
 Sets the initial position of the element's background image, if specified; values normally are paired to provide x, y positions; default position is 0% 0%.  | 
| 7 | background-repeat
 Determines how the background image is repeated (tiled) across an element.  | 
| 8 | border
 Sets all four of an element's borders; value is one or more of a color, a value for border-width, and a value for border-style.  | 
| 9 | border-bottom
 Sets an element's bottom border; value is one or more of a color, a value for border-bottom-width, and a value for border-style.  | 
| 10 | border-bottom-width
 Sets the thickness of an element's bottom border.  | 
| 11 | border-collapse
 Sets the table border rendering algorithm.  | 
| 12 | border-color
 Sets the color of all four of an element's borders; default is the color of the element.  | 
| 13 | border-left-color
 Sets the color of an element's left borders; default is the color of the element.  | 
| 14 | border-right-color
 Sets the color of an element's right borders; default is the color of the element.  | 
| 15 | border-top-color
 Sets the color of an element's top borders; default is the color of the element.  | 
| 16 | border-bottom-color
 Sets the color of an element's bottom borders; default is the color of the element.  | 
| 17 | border-left
 Sets an element's left border; value is one or more of a color, a value for border-left-width, and a value for border-style.  | 
| 18 | border-left-width
 Sets the thickness of an element's left border.  | 
| 19 | border-right
 Sets an element's right border; value is one or more of a color, a value for border-right-width, and a value for border-style.  | 
| 20 | border-right-width
 Sets the thickness of an element's right border.  | 
| 21 | border-spacing
 With separate borders set the spacing between borders. One value sets vertical and horizontal spacing and two values sets horizontal and vertical spacing respectively.  | 
| 22 | border-style
 Sets the style of all four of an element's borders.  | 
| 23 | border-top
 Sets an element's top border; value is one or more of a color, a value for border-top-width, and a value for border-style.  | 
| 24 | border-top-width
 Sets the thickness of an element's top border.  | 
| 25 | border-width
 Sets the thickness of all four of an element's borders.  | 
| 26 | bottom
 Used with the position property to place the bottom edge of an element.  | 
| 27 | caption-side
 Sets the position for a table caption.  | 
| 28 | clear
 Sets which margins of an element must not be adjacent to a floating element; the element is moved down until that margin is clear.  | 
| 29 | clip
 Sets the clipping mask for an element.  | 
| 30 | color
 Sets the color of an element.  | 
| 31 | content
 Inserts generated content around an element.  | 
| 32 | counter-increment
 Increments a counter by 1; value is a list of counter names, with each name optionally followed by a value by which it is incremented.  | 
| 33 | counter-reset
 Resets a counter to zero; value is a list of counter names, with each name optionally followed by a value to which it is reset.  | 
| 34 | cue-after
 Plays the designated sound after an element is spoken.  | 
| 35 | cue-before
 Plays the designated sound before an element is spoken.  | 
| 36 | cursor
 Defines shape of the cursor.  | 
| 37 | direction
 Defines direction of the flow of an element content.  | 
| 38 | display
 Controls how an element is displayed.  | 
| 39 | elevation
 Sets the height at which a sound is played.  | 
| 40 | empty-cells
 With separate borders, hides empty cells in a table.  | 
| 41 | float
 Determines if an element floats to the left or right, allowing text to wrap around it or be displayed inline.  | 
| 42 | font
 Sets all the font attributes for an element. Value is any of the values for − 
  | 
| 43 | font-family
 Defines the font for an element, either as a specific font or as one of the generic serif, sans-serif, cursive, fantasy, and monospace.  | 
| 44 | font-size
 Defines the font size.  | 
| 45 | font-size-adjust
 Adjusts the current font's aspect ratio.  | 
| 46 | font-stretch
 Determines the amount to stretch the current font.  | 
| 47 | font-style
 Defines the style of the face, either normal or some type of slanted style.  | 
| 48 | font-variant
 Defines a font to be in small caps.  | 
| 49 | font-weight
 Defines the font weight. If a number is used, it must be a multiple of 100 between 100 and 900; 400 is normal, 700 is the same as the keyword bold.  | 
| 50 | height
 Defines the height of an element.  | 
| 51 | left
 Used with the position property to place the left edge of an element.  | 
| 52 | letter-spacing
 Inserts additional space between text characters.  | 
| 53 | line-height
 Sets the distance between adjacent text baselines.  | 
| 54 | list-style
 Defines list-related styles using any of the values for − 
  | 
| 55 | list-style-image
 Defines an image to be used as a list item's marker, in lieu of the value for − 
  | 
| 56 | list-style-position
 Indents or extends (default) a list item's marker with respect to the item's content.  | 
| 57 | list-style-type
 Defines a list item's marker either for unordered lists (circle, disc, or square) or for ordered lists (decimal, loweralpha, lower-roman, none, upper-alpha, or upper-roman).  | 
| 58 | margin
 Defines all four of an element's margins.  | 
| 59 | margin-bottom
 Defines the bottom margin of an element. Default value is 0.  | 
| 60 | margin-left
 Defines the left margin of an element. Default value is 0.  | 
| 61 | margin-right
 Defines the right margin of an element. Default value is 0.  | 
| 62 | margin-top
 Defines the top margin of an element. Default value is 0.  | 
| 63 | marker-offset
 The marker-offset property can be used in bulleted lists for specifying the distance between the nearest border edges of a marker box (or bullet) and its associated principal box.  | 
| 64 | marks
 The marks property is used to set crop marks and cross marks on paged media. This is used with the @page rule.  | 
| 65 | max-height
 max-height property is used to constrain the height of an element.  | 
| 66 | max-width
 max-width property is used to set the maximum width of an element.  | 
| 67 | min-height
 min-height property is used to constrain the height of an element.  | 
| 68 | min-width
 min-width property is used to constrain the width of an element.  | 
| 69 | orphans
 Sets the minimum number of lines allowed in an orphaned paragraph fragment.  | 
| 70 | outline
 The outline property is a shorthand property to specify all outline properties.  | 
| 71 | outline-color
 The outline-color property is used to specify the color of the outline. Note that, unlike the border property, outline does not take up extra space and it can be non-rectangular.  | 
| 72 | outline-color-style
 The outline-style property is used to specify the style of the outline. Note that, unlike the border property, outline does not take up extra space and it can be non-rectangular.  | 
| 73 | outline-width
 The outline-color property is used to specify the color of the outline. Note that, unlike the border property, outline does not take up extra space and it can be non-rectangular.  | 
| 74 | overflow
 Determines how overflow content is rendered.  | 
| 75 | padding
 Defines all four padding amounts around an element.  | 
| 76 | padding-bottom
 Defines the bottom padding of an element. Default value is 0.  | 
| 77 | padding-left
 Defines the left padding of an element. Default value is 0.  | 
| 78 | padding-right
 Defines the right padding of an element. Default value is 0.  | 
| 79 | padding-top
 Defines the top padding of an element. Default value is 0.  | 
| 80 | page
 Associates a named page layout with an element.  | 
| 81 | page-break-after
 Forces or suppresses page breaks after an element.  | 
| 82 | page-break-before
 Forces or suppresses page breaks before an element.  | 
| 83 | page-break-inside
 Suppresses page breaks within an element.  | 
| 84 | pause
 The pause property is CSS shorthand for specifying shorthand property for specifying pauses in aural media.  | 
| 85 | pause-after
 Pauses a media after speaking an element.  | 
| 86 | pause-before
 Pauses a media before speaking an element.  | 
| 87 | pitch
 Sets the average pitch of an element's spoken content.  | 
| 88 | pitch-range
 Sets the range of the pitch, from 0 (flat) to 100 (broad); default is 50.  | 
| 89 | play-during
 If a URL is provided, it is played during an element's spoken content, specifying repeat loops the audio; mix causes it to mix with, rather than replace, other background audio.  | 
| 90 | position
 Sets the positioning model for an element.  | 
| 91 | quotes
 Sets the quote symbols used to quote text.  | 
| 92 | richness
 Sets the richness of the voice, from 0 (flat) to 100 (mellifluous); default is 50.  | 
| 93 | right
 Used with the position property to place the right edge of an element.  | 
| 94 | size
 The size property is used in paged media to specify the size of the page.  | 
| 95 | speak
 Determines how an element's content is spoken.  | 
| 96 | speak-header
 Determines if table headers are spoken once for each row or column or each time a cell is spoken.  | 
| 97 | speak-numeral
 Determines how numerals are spoken.  | 
| 98 | speak-punctuation
 Determines if punctuation is spoken or used for inflection.  | 
| 99 | speech-rate
 Sets the rate of speech; a number sets the rate in words per minute.  | 
| 100 | stress
 Sets the stress of the voice, from 0 (catatonic) to 100 (hyperactive); default is 50.  | 
| 101 | table-layout
 Determines the table-rendering algorithm.  | 
| 102 | text-align
 Sets the text alignment style for an element.  | 
| 103 | text-decoration
 Defines any decoration for the text; values may be combined.  | 
| 104 | text-indent
 Defines the indentation of the first line of text in an element; default is 0.  | 
| 105 | text-shadow
 Creates text drop shadows of varying colors and offsets.  | 
| 106 | text-transform
 Transforms the text in the element accordingly.  | 
| 107 | top
 Used with the position property to place the top edge of an element.  | 
| 108 | vertical-align
 Sets the vertical positioning of an element.  | 
| 109 | visibility
 Determines if an element is visible in the document or table.  | 
| 110 | voice-family
 Selects a named voice family to speak an element's content.  | 
| 111 | volume
 Sets the volume of spoken content; numeric values range from 0 to 100.  | 
| 112 | white-space
 Defines how whitespace within an element is handled.  | 
| 113 | widows
 Sets the minimum number of lines allowed in a widowed paragraph fragment.  | 
| 114 | width
 Defines the width of an element.  | 
| 115 | word-spacing
 Inserts additional space between words.  | 
| 116 | z-index
 Sets the rendering layer for the current element.  | 
| Sr.No. | Property & Description | 
|---|---|
| 1 | :active
 Use this class to add special effect to an activated element.  | 
| 2 | :focus
 Use this class to add special effect to an element while the element has focus.  | 
| 3 | :hover
 Use this class to add special effect to an element when you mouse over it.  | 
| 4 | :link
 Use this class to add special effect to an unvisited link.  | 
| 5 | :visited
 Use this class to add special effect to a visited link.  | 
| 6 | :first-child
 Use this class to add special effect to an element that is the first child of some other element.  | 
| 7 | :lang
 Use this class to specify a language to use in a specified element.  | 
| 8 | :first-letter
 Use this element to add special effect to the first letter of a text.  | 
| 9 | :first-line
 Use this element to add special effect to the first line of a text.  | 
| 10 | :before
 Use this element to insert some content before an element.  | 
| 11 | :after
 Use this element to insert some content after an element.  |