CSS basic syntax and structure

Table of Contents

1. Selector

The selector is used to target HTML elements to which the styles will be applied.

selector {
  /* Declaration Block */
}

Example

body {
  /* Styles for the body element */
}

The declaration block is enclosed in curly braces {} and contains one or more property-value pairs.

selector {
  property: value;
}

Example

body {
  background-color: #f0f0f0;
  color: #333;
}

Each property-value pair defines a specific aspect of the element’s style.

selector {
  property1: value1;
  property2: value2;
  /* Add more properties as needed */
}

Example

h1 {
  font-size: 24px;
  color: #007bff;
}

Comments in CSS are written using /* */. They are ignored by browsers and can be used for documentation.

/* This is a comment */
selector {
  /* Comment for a property */
  property: value;
}