Rulesets and their components are important pieces of terminology that anyone working with CSS should be familiar with.
First a Visual
The image below shows a CSS ruleset broken down into a variety of parts. We'll define each of the highlighted parts below.
- Ruleset - Simply put a ruleset (also called rule) is the combination of a selector and a declaration block.
- Selector - A strict definition of a selector is everything up to, but not including, the first left curly brace ( { ) . To be valid a ruleset's selector must always be accompanied by a declaration block. In our example the selector is the h1.
- Declaration Block - A declaration block starts with a left curly brace ( { ), and ends with the matching right curly brace ( } ). It can also contain a list of declarations each of which must be separated by a semicolon ( ; ).
- Declaration - A non-empty declaration consists of a property name, followed by a colon ( : ), followed by a property value.
- Property Name - (shown in the image as property), is an identifier that specifies which CSS standard property should be used for styling the element(s) targeted by the selector.
- Property Value - (shown in the image as value), is the particular input that will passed to the specified property.
Source: W3C CSS Working Group
Conclusion
While it is possible to use CSS, even frequently, without specifically knowing all of the terms covered in this article, learning them can help you clearly communicate your thoughts, and demonstrate to others that you deeply understand important aspects of CSS syntax.