CSS syntax and selectors

A CSS rule set consists of a selector and a declaration block, as follows:

  • The selector points to the HTML element that will be styled.

  • The declaration block contains one or more declarations separated by semicolons.

  • Each declaration includes a CSS property name and a value separated by a colon.

  • A CSS declaration always ends with a semicolon, and declaration blocks are surrounded by curly braces.

  • CSS selectors are used to find (or select) HTML elements based on their element name, ID, class, attribute, and more.

CSS rule set.

For more information on using CSS syntax, refer to the W3Schools website:

https://www.w3schools.com/css/css_syntax.asp

Syntax is very important, and errors are not tolerated by the browser at all. Any error results in either the CSS not working at all or possibly receiving unexpected display results. If CSS does not seem to be working, it is likely there is a syntax error in the file. Common errors include the following:

  • A typo or incorrect selector. For example, the word "colour" does not work; instead, use "color".

  • Missing semi-colon at the end of a declaration.

  • Missing curly braces at the beginning or end of the declaration block.

  • Missing colon between the property and its value.

  • Adding a comment to the file using the /* but not closing the comment with */.