Basic CSS Syntax

CSS has a simple, consistent syntax. Every CSS rule follows the same pattern: a selector, followed by a declaration block containing one or more declarations.

The CSS Rule Structure

selector {
    property: value;
    property: value;
}

• Selector — targets the HTML element(s) you want to style
• Property — the aspect you want to change (color, font-size, margin, etc.)
• Value — what you want to set the property to
• Each declaration ends with a semicolon ;
• Declarations are wrapped in curly braces { }

Examples

/* Style all paragraphs */
p {
    color: darkblue;
    font-size: 16px;
    line-height: 1.6;
}

/* Style all h1 headings */
h1 {
    color: #2c3e50;
    font-family: Arial, sans-serif;
    text-align: center;
}

Multiple Declarations

You can add as many property-value pairs as you want inside the curly braces. Each one changes a different aspect of the element's appearance.

Case Sensitivity

CSS properties and most values are case-insensitive, but it is best practice to write them in lowercase. Selector names that match HTML elements are also case-insensitive, but class and ID names are case-sensitive.