CSS2 - Reference Guide
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. |
Pseudo-classes & Pseudo-elements
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. |