CSS (Cascading Style Sheets)

CSS is a stylesheet language used to describe the presentation and visual styling of HTML documents. It controls layout, colors, fonts, spacing, and responsive design.

Basic Syntax

css
selector {
  property: value;
}

Key Concepts

Selectors Target HTML elements to apply styles.

Box Model Defines element spacing with margin, border, padding, and content.

Flexbox & Grid Modern layout systems for responsive designs.

Responsive Design Media queries adapt layouts to different screen sizes.

Example

css
.container {
  display: flex;
  justify-content: center;
  padding: 20px;
  background-color: #f0f0f0;
}

@media (max-width: 768px) {
  .container {
    flex-direction: column;
  }
}

Modern CSS Features

  • CSS Variables (Custom Properties)
  • CSS Grid
  • Flexbox
  • CSS Modules
  • Animations and Transitions