Names for clarity

This is a simple question, are CSS selectors and declarations considered the same thing? Please don’t chastise me for asking this question. It appears to be the same, but doesn’t based on its usage that I have heard (on the internet, video teachings, etc.)

#thisisaselector .whatever
{
  color: red;
}

We will use this as our example.

The selector is the “#thisisaselector .whatever”
The property is the “color”
The value is “red”
The declaration (or also referred to as declaration block") is everything within the brackets. So all of this is the declaration part. There can be multiple property:values there and it will still be part of the declaration. I just did one since it’s easiest for me.

  color: red;

The CSS rule is the entire thing. The whole shabang. The declaration block + the selector.

No, as Ryan points out above. The selector is the bit outside the curly braces. The declaration is the whole lot—that is, selector plus curly braces and anything between them.

The declaration is all of the property/values INSIDE the curly braces.
The “rule” is the selector + curly braces + the declaration block.

You are confusing rule with declaration, I believe.

Argh, I knew I should have checked. It’s very late here—that’s my excuse. :stuck_out_tongue:

It’s easy to remember :slight_smile: . I think of “rule” as being “ruler” or “king” that presides over everything (i.e. the selector/properties/values.)

Cop out :stuck_out_tongue:

2 Likes

The only reason I know this is because I looked it up after the quiz not too long ago.

The whole lot is called a rule set (also called “rule”). A rule is made of a selector and a declaration block. Inside the declaration block are any number of declarations, what we colloquially call properties.

rule-set:
    selector declaration-block

declaration-block:
    {
        declaration;
        declaration;
        declaration;
        ...
    }

declaration:
    property-name: property-value
1 Like

I get it. Thanks!

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.