CSS Structural pseudoclasses - Part 1
Notes:
CSS - Pseudo Class Selectors (DOM Tree Structure):
CSS - Pseudo Class Selectors (Structural) - Part 1:
They are used to target html elements and apply styles based on the relationship present between the html elements in the DOM tree structure. (I.e. root, first-child, last-child etc.)
1.
selector : root
{
declaration list;
}
It selects any html element targeted by the selector, if it is the root element in the DOM tree
Ex:
html : root
{
background-color : yellow;
}
It selects html tag, if it is root element in DOM tree. W.K.T. always html tag will be the root element of the DOM tree, hence root pseudo class selector always targets to html element
2.
selector : empty
{
declaration list;
}
It selects any html element targeted by the selector, if it is the empty element (has no content)
Ex:
p: empty
{
border:2px solid red;
}
It selects any p element, if it is the empty element
Interview Questions:
