Interactive online courses HTML Academy
2026-03-09 10:57 Diff
https://htmlacademy.org/courses/html-css-basics/css-essentials/css-rules

You have finished filling the blog with content. Now it’s time to design it. In order to do this, we need to learn more about CSS.

CSS is the language that we use to apply a visual design to structured documents, such as HTML documents. CSS syntax is straightforward: it’s a flat list of CSS rules. A CSS rule consists of a selector and a list of properties and their values:

selector { property: value; property: value; }

Comments are also supported in CSS as well. In order to leave a comment, you use the characters /* and */. Here is an example of a CSS rule from the first chapter:

.feature-kitten { padding-top: 60px; /* Top padding */ background-image: url("img/bottle.svg"); /* Background image */ }

Let’s start with the design of the navigation block. For now, just comment out the CSS rule and see what changes.

We call CSS rules “flat”, because they cannot have other rules nested inside them. Perhaps this feature will be added to new versions of the language.

In addition to CSS rules (rule sets), the language also features so-called “at rules”. They begin with the character @, such as, for example, @font-face. “At rules” are also called CSS directives. These do have CSS rules inside them.

We do not need CSS directives in order to complete our current assignments. However, we will definitely learn more about them later.