CSS Syntax

What are the basic CSS syntax?

CSS syntax consists of selectors, properties, and values. The selectors identify the HTML element(s) that the CSS rules should apply to, while the properties specify the visual characteristics of those elements, and the values define the specific settings for each property.

This is an example of the basic CSS syntax:

selector { property: value; property: value; property: value; }

The CSS syntax is explained below:

Selector: A selector is used to target the HTML element(s) that the CSS rules should apply to. It can be a tag name, class, ID, or a combination of these. Selectors can also use pseudo-classes and pseudo-elements to target specific states of an element, such as :hover or ::before.

Property: A property is a visual characteristic of an element, such as color, font-size, or background-color. There are many different properties that can be used in CSS, and they control everything from the size and position of elements to their color and typography.

Value: A value is the specific setting for a property. For example, if the property is color, the value might be "red" or "#ff0000". Values can be numeric, like font-size: 16px, or they can be words or other data types, like font-family: Arial, sans-serif.

CSS declarations can also be grouped together using commas to apply the same styles to multiple selectors:

selector1, selector2 { property: value; property: value; property: value; }

Last updated