Skip to main content
Practice

Basic Structure of CSS

Basic Structure: Selectors, Properties, Values​

CSS is structured as follows:

Basic Structure of CSS
selector {
  property: value;
}

Similar to how a printer prints in color based on coordinates, CSS has rules defining which HTML element (selector) should be styled with what (property) and how (value).

  • Selector: Select the HTML element to style

  • Properties and Values: Specify what property (e.g., color, font size) and how (e.g., red, 16px) to apply to the selected element

For instance, to apply red color to an h1 tag defined earlier, you write the following CSS:

CSS
h1 {
  color: red;
}

Here, h1 is the selector, color is the property, and red is the value.

Always end the value with a semicolon (;) to indicate the end of that line.