Cascading Style Sheets

The Selector


Selector is the element in the beginning of a declaration in an external stylesheet or an internal style element. The Declaration is laid out like this: [selector]{[attribute1]:[value1];[attribute2]:[value2][attributen]:[valuen]; The Selector object controls the selector itself. Selector is controlled by SelectorList which is basically an ArrayList of Selectors with some management functionality thrown in for good measure. In CSS Selectors can be referenced in a miriad of ways but can be broken down into the following groups...




CREATED 2012-06-24 08:25:53.0

00-12-98

UPDATED 2012-06-24 08:31:46.0

Class/ID...


    .topNavBarTable{width:100%;} <-- Sets width to 100% of all elements with class="topNavBarTable" #topNavBarTable{width:100%;} <-- Sets the width to 100% of all elements with id="topNavBarTable"
  • Class - .[classname] - any element bearing the attribute class="[classname]"
  • UD - #[idReference] - any element with the attribute id=[idReference]

CREATED 2012-06-24 08:29:29.0

00-12-99

UPDATED 2012-06-24 08:33:42.0

Element...


Element - Selects all of a specific element p{color:red;} <-- Sets the color of all paragraphs to red Elements can be grouped together to apply a specific set of attributes by seperating element names in the following ways:

    strong, em, super{color:blue;} <-- Sets the color of all <strong>, <em> and <super> elements. p em{color:green;} <-- Sets the color of all <em> elements INSIDE a <p> element. p>em{color:green;} <-- Sets the color of all <em> elements that have a PARENT of <p>. p+em{color:green;} <-- Sets the color of all <em> elements come IMMEDIATLY AFTER a <p> element. p~em{color:green;} <-- Sets the color of all <em> elements come IMMEDIATLY BEFORE a <p> element.
  • Comma - creates a list of elements to apply attributes to
  • Space - applys attributes in a hierarchial model.
  • > - Parent of
  • + - Immediately after
  • ~ - Immediately before

CREATED 2012-06-24 08:33:48.0

00-12-9A

UPDATED 2012-06-24 08:42:49.0

Attributes...


Attributes - Selects all elements with this specific attribute assigned
= Equals title=List{color:red;} Sets all elements with the attribute title="List" to the color red
~= Contained in title~=List{color:red;} Sets all elements with "List" in the title attribute to the color red
|= Starting with title|=List{color:red;} Sets all elements with a title attribute that starts with "List" to the color red
^= Begins with title^=List{color:red;} Sets all elements with a title attribute that begins with "List" to the color red
$= Ends with title$=List{color:red;} Sets all elements with a title attribute that ends with "List" to the color red
*= Within title*=List{color:red;} Sets all elements with "List" somewhere in the title attribute to the color red

CREATED 2012-06-24 08:36:50.0

00-12-9B

UPDATED 2012-06-24 08:42:53.0

Condition...


Condition - Selects elements that have a specific condition like a link visited a:visited{color:#FF0000;} Sets the color in all links that have been visited to red. List of conditions: :link, :visited, :active, :hover, :focus, :first-letter, :first-line, :first-child, :before, :Condition - Selects elements that have a specific condition like a link visited after, :lang(language), :first-of-type, :last-of-type, :only-of-type, :only-child, :nth-child(n), :nth-last-child(n), :nth-of-type(n), :nth-last-of-type(n), :last-child :root, :empty, :target, :enabled, :disabled, :checked, :not(selector)

The abstract Selector class builds the basic selector. It provides the key elements needed to develop the basic selector. Its extended classes cover the serialization of those elements.

CREATED 2012-06-24 08:38:42.0

00-12-9C

UPDATED 2012-06-24 08:42:56.0

Knowledge

CSS2
L
I
N
K
S

DBID: db.wam

Page Server: Ithica

©2012 Leistware Data Systems

      Hello anonymous