Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS terminology: what are these called?

Consider:

p {
  ...
}

.foo {
  ...
}

#bar {
  ...
}

What is the correct name for these statements in CSS? I've seen them called selectors, rules or rulesets, but which is correct?

like image 315
John Topley Avatar asked Jul 13 '09 15:07

John Topley


People also ask

What are the CSS terminology?

CSS (Cascading Style Sheets) is a declarative language that controls how webpages look in the browser. The browser applies CSS style declarations to selected elements to display them properly. A style declaration contains the properties and their values, which determine how a webpage looks.

How many types of rulesets are there in CSS?

There are two kinds of statements: Rulesets (or rules) that, as seen, associate a collection of CSS declarations to a condition described by a selector.

What are CSS declarations?

In CSS, a declaration is the key-value pair of a CSS property and its value. CSS declarations are used to set style properties and construct rules to apply to individual or groups of elements. The property name and value are separated by a colon, and the entire declaration must be terminated by a semi-colon.

What * means in CSS?

The Universal Selector is the * in CSS. Literally the asterisk character. It is essentially a type selector that matches any type. Type meaning an HTML tag like <div> , <body> , <button> , or literally any of the others. A common use is in the universal reset, like this: * { margin: 0; padding: 0; }


2 Answers

A rule would be considered:

p {…}

A selector in this case is:

p

A rule is made up of selectors and declarations. A declaration is property:value so the entire rule would be:

selector { property:value }

A rule can have multiple declarations and multiple selectors so we can actually have:

selector, selector2
{
  property:value;
  property2:value;
} 

A rule set would be multiple rules.

Here's a quick source on this or the CSS 1 Specification.

like image 136
JoshBerke Avatar answered Oct 13 '22 12:10

JoshBerke


CSS is made up of a number of rules in the form

selector{declaration}

So the .foo and #bar and p are called selectors but the full statement with the curlies are called rules.

like image 41
Vincent Ramdhanie Avatar answered Oct 13 '22 11:10

Vincent Ramdhanie