CSS Tutorial

Introduction

CSS Properties

CSS Designing

CSS Advance Topics

CSS FAQs

Edit Template

Home
/
Syntax of CSS

CSS Tutorial

Introduction

CSS Properties

CSS Designing

CSS Advance Topics

CSS FAQs

Edit Template

Home
/
Syntax of CSS

CSS Syntax

CSS (Cascading Style Sheets) works by applying rules to HTML element. Each rule consists of two main parts:

Selector – Targets the HTML elements you want to style.
Declaration Block – Contains one or more property: value pair that define the style.

Basic Syntax

				
					selector {
    property: value;
}

The selector chooses the element (like h1, p, div, or a class).
The property is what you want to change (like color or font-size).
The Value defines the setting for that property (like blue or 16px).
A semicolon (;) is required at the end of each declaration.

Example 1: Single Property

				
					h2 {
    color: blue;
}

h2 is the selector (targets all <h2> elements).
color is the property (what we want to style).
blue is the value (how we want to style it).

The rule will turn the text of all <h2> element blue.

Example 2: Multiple Properties

				
					button {
    color: white;
    background-color: black;
    border: none;
    border-radius: 5px;
}

button is the selector (target all <button> elements).
Multiple style properties are used to define how buttons should look (white text, black background, no border, and round corners)

Notes

You can apply multiple declarations inside a single set of {} braces.
Always use semicolons to separate each declaration.
Proper indentation and spacing make your CSS easier to read.