CSS Syntax

3 min read

Deviation Actions

Celvas's avatar
By
Published:
2.6K Views
A CSS rule in its most basic form is made up of two components: a selector and a declaration.

.example { color: #000; }

As the term suggests, a selector is utilized to target (select) a certain element or certain elements and enable you to style them. On deviantART, you'll find that the selector mostly in use is class, which is depicted as a dot, prominently used in tandem with the HTML tags <div> and <span>.

Following the selector comes a curly bracket. The curly brackets contain the actual style information, in other words: the declarations. In the above example, the declaration is:

color: #000

A declaration consists of two parts: a property (here: color) and the value of the property (here: #000). Each declaration finishes with a semicolon. While the curly brackets are meant to signify start and end of the styling of a specific selector, the semicolon signifies the completion of a declaration.

Let's take another look at the complete rule:

.example { color: #000; }

It means that every element with the class "example" includes text the color of which is black (#000 = shortened hex for black).


© 2013 - 2024 Celvas
Comments9
Join the community to add your comment. Already a deviant? Log In
miontre's avatar
Great explanation :love:

I'm sure `GillianIvy will want to put this one into her frequently referenced favourites folder! :la: I know I would do the same if I had one :P :P