CSS Declarations

Basic

What a declaration does

A CSS declaration specifies a property and the value assigned to that property. Declarations are the part of a style rule that describes the presentation to apply to elements matched by its selector.

1
2

color: rebeccapurple;
margin-block: 1rem;

Here, color and margin-block are properties, and each value follows the property name after a colon.

Declarations inside a rule

A declaration block can contain multiple declarations. Each declaration is terminated by a semicolon, allowing several properties to contribute to the same style rule.

1
2
3
4
5

.card {
  padding: 1rem;
  border: 1px solid currentColor;
  border-radius: 0.5rem;
}

Property values matter

?

A property does not accept an arbitrary value. Each CSS property defines the kinds of values it accepts, and the value determines the result of the declaration when the rule applies.

1
2

font-size: 1.25rem;
line-height: 1.6;

Every rule you will ever write is made of these parts. When you are ready, take the CSS Declarations quiz.