ADVERTISEMENTS

CSS Syntax

CSS (Cascading Style Sheets) syntax consists of a set of rules that define how HTML elements should be displayed on a web page. Here is an overview of the basic syntax of CSS:

  • Selectors: CSS selectors are used to target HTML elements that you want to apply styles to. You can select elements based on their tag name, class name, ID, attributes, or even their position in the HTML hierarchy.
  • Declaration block: After selecting the elements you want to style, you define the styles for those elements in a block of code known as the "declaration block". The declaration block is enclosed in curly braces and contains one or more declarations separated by semicolons.
  • Property: A CSS property is a style attribute that you want to set for the selected elements. For example, the "color" property sets the color of the text, the "background-color" property sets the background color of an element, and the "font-size" property sets the size of the font.
  • Value: The value of a CSS property defines the actual style you want to apply. For example, the "color" property might have a value of "red" to make the text appear in red, or "#000000" to set the color to black.
ADVERTISEMENTS

Basic CSS Syntax

selector {
   property: value;
   property: value;
}

For example, to set the font size of all paragraphs to 16 pixels and the background color of all headings with class "title" to blue, you would write:

p {
  color: #333333;
  font-size: 16px;
  font-family: Arial, sans-serif;
}
h1.title {
   background-color: blue;
}

In this example, the selector is the p element, and the { } brackets contain three property: value declarations. The color property sets the text color to a dark gray, the font-size property sets the font size to 16 pixels, and the font-family property sets the font family to Arial or a similar sans-serif font.

ADVERTISEMENTS