You are on page 1of 6

List of 100 commonly used CSS Commands

1. `color`: Sets the color of text.

2. `font-family`: Defines the font family for text.

3. `font-size`: Sets the size of the font.

4. `font-weight`: Specifies the boldness of the font.

5. `font-style`: Sets the style of the font (italic, oblique, normal).

6. `text-align`: Aligns text horizontally.

7. `text-decoration`: Adds decoration to text (underline, overline, line-through).

8. `line-height`: Sets the height of a line of text.

9. `background-color`: Sets the background color of an element.

10. `background-image`: Sets the background image for an element.

11. `background-size`: Sets the size of the background image.

12. `background-position`: Sets the position of the background image.

13. `padding`: Adds space inside an element.

14. `margin`: Adds space outside an element.

15. `border`: Sets the border of an element.

16. `border-radius`: Rounds the corners of an element's border.

17. `width`: Sets the width of an element.


18. `height`: Sets the height of an element.

19. `display`: Defines how an element is displayed (block, inline, inline-block).

20. `position`: Sets the positioning method of an element (static, relative, absolute, fixed).

21. `top`: Sets the top position of an absolutely positioned element.

22. `left`: Sets the left position of an absolutely positioned element.

23. `right`: Sets the right position of an absolutely positioned element.

24. `bottom`: Sets the bottom position of an absolutely positioned element.

25. `float`: Specifies whether an element should float left, right, or none.

26. `clear`: Clears floated elements.

27. `overflow`: Specifies what to do when content overflows an element's box.

28. `z-index`: Sets the stack order of an element.

29. `visibility`: Sets the visibility of an element.

30. `opacity`: Sets the transparency level of an element.

31. `text-transform`: Transforms text to uppercase, lowercase, or capitalize.

32. `white-space`: Specifies how white space inside an element is handled.

33. `word-wrap`: Allows long words to be broken and wrapped onto the next line.

34. `text-overflow`: Specifies how overflowed content should be signaled to the user.

35. `cursor`: Specifies the type of cursor to be displayed when hovering over an element.

36. `box-sizing`: Defines how the total width and height of an element are calculated.

37. `outline`: Sets an outline around an element.


38. `list-style`: Sets the style of list items (bullet, number, image).

39. `list-style-type`: Sets the type of list item marker.

40. `list-style-image`: Sets an image as the list item marker.

41. `list-style-position`: Sets the position of the list item marker.

42. `overflow-x`: Specifies how to handle horizontal overflow.

43. `overflow-y`: Specifies how to handle vertical overflow.

44. `text-shadow`: Adds shadow to text.

45. `box-shadow`: Adds shadow to an element's box.

46. `transition`: Adds transition effects to an element's property changes.

47. `transform`: Applies 2D or 3D transformations to an element.

48. `animation`: Animates an element.

49. `flex-direction`: Defines the direction of the flex container.

50. `justify-content`: Aligns flex items along the main axis of the flex container.

51. `align-items`: Aligns flex items along the cross axis of the flex container.

52. `flex-grow`: Specifies how flex items grow relative to each other.

53. `flex-shrink`: Specifies how flex items shrink relative to each other.

54. `flex-basis`: Specifies the initial size of a flex item.

55. `flex`: Shorthand for flex-grow, flex-shrink, and flex-basis.

56. `grid-template-columns`: Defines the columns of a grid container.

57. `grid-template-rows`: Defines the rows of a grid container.


58. `grid-gap`: Sets the gap between grid rows and columns.

59. `grid-column`: Specifies where to place a grid item horizontally.

60. `grid-row`: Specifies where to place a grid item vertically.

61. `grid-area`: Specifies a grid item's size and location within the grid.

62. `grid-template-areas`: Defines named grid areas.

63. `grid-auto-columns`: Sets the size of columns that are not explicitly defined.

64. `grid-auto-rows`: Sets the size of rows that are not explicitly defined.

65. `grid-auto-flow`: Specifies how auto-placed items are placed in the grid.

66. `place-items`: Aligns items along both the block and inline directions.

67. `place-content`: Aligns content along both the block and inline directions.

68. `place-self`: Aligns a single item in the grid container.

69. `text-align-last`: Aligns the last line of text in an element.

70. `text-justify`: Specifies the justification method used when text-align is "justify".

71. `tab-size`: Specifies the width of tab characters.

72. `tab-style`: Specifies the style of tab characters.

73. `text-indent`: Specifies the indentation of the first line in a text block.

74. `text-orientation`: Specifies the orientation of text in a line.

75. `text-combine-upright`: Allows the vertical alignment of characters within a line.

76. `word-break`: Specifies how words should be broken when reaching the end of a line.

77. `word-spacing`: Specifies the spacing between words.


78. `letter-spacing`: Specifies the spacing between characters.

79. `font-variant`: Controls the usage of alternate glyphs for smaller text.

80. `font-feature-settings`: Allows control over advanced typographic features.

81. `font-kerning`: Specifies whether kerning should be applied to the font.

82. `font-variant-caps`: Controls the usage of small caps glyphs.

83. `font-size-adjust`: Preserves the font size of a fallback font.

84. `font-stretch`: Condenses or expands the current font family.

85. `direction`: Specifies the text direction/writing direction.

86. `unicode-bidi`: Specifies the level of embedding of bidi overrides.

87. `hyphens`: Specifies how words should be hyphenated.

88. `image-rendering`: Controls the quality of image rendering.

89. `object-fit`: Specifies how an element's content should be resized to fit its container.

90. `object-position`: Specifies the alignment of an element's content within its box.

91. `will-change`: Informs the browser ahead of time of what kinds of changes it can expect to see on an element.

92. `backface-visibility`: Defines whether or not the back face of an element should be visible when turned towards the user.

93. `user-select`: Specifies whether the user can select text.

94. `pointer-events`: Determines whether an element can be the target for pointer events.

95. `resize`: Specifies whether an element is resizeable by user.

96. `perspective`: Specifies the perspective from which an element is viewed.

97. `perspective-origin`: Sets the origin for the perspective property.


98. `transform-origin`: Sets the origin for transformation.

99. `transform-style`: Specifies how nested elements are rendered in 3D space.

100. `transition-property`: Specifies the name of the CSS property to which a transition effect is applied

You might also like