CO PILOT
COMMON CSS PROPERTIES

on

🎨 Common CSS Properties

Category Key Properties Purpose
Text & Fonts color, font-family, font-size, font-weight, line-height, text-align, text-decoration, letter-spacing Control typography, alignment, and readability
Box Model margin, padding, border, width, height, max-width, min-height Define spacing, sizing, and element boundaries
Backgrounds background-color, background-image, background-size, background-repeat, background-position Style element backgrounds with colors or images
Layout display, position, top, right, bottom, left, z-index, float, clear Control element positioning and stacking
Flexbox/Grid flex, flex-direction, justify-content, align-items, grid-template-columns, grid-template-rows, gap Create responsive layouts
Visual Effects opacity, box-shadow, text-shadow, border-radius Add depth, transparency, and rounded corners
Lists & Tables list-style, list-style-type, border-collapse, table-layout Customize lists and table formatting
Transitions & Animations transition, transition-duration, animation, animation-delay, animation-iteration-count Add motion and interactivity
Others cursor, overflow, visibility, clip-path Control user interaction and element visibility

✨ Notes

  • Many properties have shorthand versions (e.g., margin sets all sides, background sets multiple background attributes).
  • Properties often work together: for example, display: flex unlocks flexbox-related properties like justify-content and align-items.
  • Mastering the box model (margin, border, padding, content) is essential for layout control.

Comments

Post a Comment