CSS Syntax

A CSS Stylesheet consists of some specific rules that are interpreted by the web browser, and then are applied to the HTML Elements.

h1 { color:red; text-align:center;}

h1 - Selector

The selector specifies the element on which the style is to be applied. In this case the element is h1, so the style will be applied to all the h1 tags.

color:red - property:value

The declarations within the brackets define how the element will look like on a webpage. Each declaration consists of two parts, a property and a value, seperated by a colon (:) and ending with a semi-colon(:). The declaration blocks are written within the curly brackets {}

The property is the style attribute, like font-size, font-family, color etc. Each property has a value, like font-size having value of 14px & color having value of blue.

Example:

h1 { color:red; text-align:center; }

To make the code look better, we can put each declaration on a seperate line:

h1 {
  color:red;
  text-align:center;
  background-color:orange;
}

In the above example, h1 is the selector. color, text-align & background-color are the CSS properties, and red, center & orange are the corresponding values of the mentioned properties respectively.

Let's have a look at another example:

p {
  color:black;
  font-size:14px;
}