Skip to content
expirmental stuffs about CSS
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


1. CSS

  1.1. Selector Anatomy

    There are some variations for the selector identifier.
    Let's ignore a selector identifier can be found nested or comma separated for now.
    As such, the possible variations, as examples, are found below.

    1.1.1. Single Selector Idenfitier Variations h1 (a simple tag) .test (a simple class) #unique (a simple id) * (any element) :link (alone pseudo element or class) h1.test (tag plus one single class) h1#unique (tag plus a unique id) h1#unique.test (tag plus a unique id and a single class) h1#unique.test.test2 (tag plus a unique id and two or more classes) h1#unique.test.test2:first-line (tag plus a unique id, classes and one or more pseudo-elements) h1[attr1][attr2][attrN] (tag with one or more attributes) *[attr1] (any element with specific attributes)

      There a plenty of possible combinations, but these ones above are enough to give a rough idea of what I want to illustrate.
      So, summing everything up, there are some important pieces there:
        * tag (only one per single selector identifier - SSI)
        * classes (one or more classes per SSI)
        * ID (only one per SSI)
        * pseudo-classes or pseudo-elements
        * the special any element matcher * that acts like a tag
        * attributes (can appear one or more times per SSI)

      So basing on all these premises it'll be created regular expression patterns to define each one of these pieces. 
Something went wrong with that request. Please try again.