Css Syntax

CSS Syntax:

CSS syntax is quite straightforward once you get the hang of it. Here's a breakdown.

Css Syntax:

Selector: This is the HTML element you want to style.

It could be a tag, a class, an ID, or even a combination of these.

                          
                            p {
                                /* styles for paragraphs go here */
                            }
                            
                            .class-name {
                                /* styles for elements with this class go here */
                            }
                            
                            #id-name {
                                /* styles for the element with this ID go here */
                            }

Declaration Block: This is a set of CSS properties and their values enclosed in curly braces {}.

Each declaration should end with a semicolon.

                          
                            p {
                                color: blue;
                                font-size: 16px;
                            }

Property: This is what you want to change about the selected element. Examples include color, font-size, margin, etc.

Value: This is the value you assign to the property. For example, blue for color, 16px for font-size.

Putting it all together:

                          
                            /* Selector */
p {
    /* Declaration Block */
    color: blue; /* Property:Value */
    font-size: 16px; /* Property:Value */
}

/* Another Selector */
h1 {
    color: green;
    font-size: 24px;
}

In this example, all <p> elements will have blue text with a font size of 16 pixels, and all <h1> elements will have green text with a font size of 24 pixels.

The key aspect of CSS is inheriting and that is why styles are keeping up top to bottom and can be seen as more general rules.