\/* the style will be applied to all elements using intro for class attribute*\/
\n.intro
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to the element with id attribute set to firstname*\/<\/p>\n
#firstname
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all elements*\/
\n*
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all p elements*\/
\np
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all h1 and p elements*\/
\nh1,p
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to p elements that are children of div elements*\/
\ndiv p
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to the p elements that are placed at the same level of a div element. p elements immediately after div elements for example*\/
\ndiv+p
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to anchor elements with target attributes*\/
\na[target]
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all anchor elements with _blank as the target*\/
\na[target=_blank]
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all elements with title attribute has the word flower*\/
\n[title~=flower]
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all elements where language attribute starts with en*\/
\n[lang|=en]
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all unvisited links*\/
\na:link
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all visited links*\/
\na:visited
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all active links*\/
\na:active
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied on anchor links when mouse over on it *\/
\na:hover
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to input elements with focus*\/
\ninput:focus
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to the first letter of all paragraphs*\/
\np:first-letter
\n{
\nfont-size:200%;
\ncolor:#8A2BE2;
\n}<\/p>\n
\/* the style will be applied to the first line of each p element*\/
\np:first-line
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to the first child of each p element*\/
\np:first-child
\n{
\nbackground-color:yellow;
\n}<\/p>\n
\/* the style will be applied to all p elements. the text will be added before each p element*\/
\np:before
\n{
\ncontent:”Add this word before each p element: “;
\n}<\/p>\n
\/* the style will be applied to all p elements. the text will be added after each p element*\/
\np:after
\n{
\ncontent:”- after p element “;
\n}<\/p>\n
\/* the style will be applied to all p elements with language attribute where lang attribute starts with it*\/
\np:lang(it)
\n{
\nbackground:yellow;
\n}<\/p>\n
\/* the style will be applied to all ul elements preceeded by p elements*\/
\np~ul
\n{
\nbackground:#ff0000;
\n}<\/p>\n
\/* the style will be applied to div elements with class attribute starts with the word test*\/
\ndiv[class^=”test”]
\n{
\nbackground:#ffff00;
\n}<\/p>\n
\/* the style will be applied to all div elements whose class attribute ends with test*\/
\ndiv[class$=”test”]
\n{
\nbackground:#ffff00;
\n}<\/p>\n
\/* the style will be applied to all div elements where the class attribute contains the term test anywhere*\/
\ndiv[class*=”test”]
\n{
\nbackground:#ffff00;
\n}<\/p>\n
\/* the style will be applied to the document root*\/
\n:root
\n{
\nbackground:#ff0000;
\n}<\/p>\n
\/* the style will be applied to all empty p elements with no child and no text element*\/
\np:empty
\n{
\nbackground:#ff0000;
\n}<\/p>\n
\/* add this image before the current active link *\/
\n:target:before
\n{
\ncontent: url(\/images\/lamp.gif);
\n}<\/p>\n
\/* the style will be applied to all enabled input text element*\/
\ninput[type=”text”]:enabled
\n{
\nbackground:#ffff00;
\n}<\/p>\n
\/* the style will be applied to all disabled input text element*\/
\ninput[type=”text”]:disabled
\n{
\nbackground:#dddddd;
\n}<\/p>\n
\/* the style will be applied to all checked input elements*\/
\ninput:checked
\n{
\nbackground:#ff0000;
\n}<\/p>\n
\/* the style will be applied to all elements other than p*\/
\n:not(p)
\n{
\nbackground:#ff0000;
\n}<\/p>\n
\/* the style will be applied to the selected text*\/
\n::selection
\n{
\ncolor:#ff0000;
\n}<\/p>\n
::-moz-selection
\n{
\ncolor:#ff0000;
\n}<\/p>\n
p:first-of-type
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:last-of-type
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:only-of-type
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:only-child
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:nth-child(2)
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:nth-last-child(2)
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:nth-of-type(2)
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:nth-last-of-type(2)
\n{
\nbackground:#ff0000;
\n}<\/p>\n
p:last-child
\n{
\nbackground:#ff0000;
\n} From: http:\/\/sitestree.com\/?p=113
Categories:Web Development, CSS, Root, By Sayed Ahmed
Tags:Css selector, Css
Post Data:2012-11-30 04:10:30<\/p>\n","protected":false},"excerpt":{"rendered":"
\/* the style will be applied to all elements using intro for class attribute*\/ .intro { background-color:yellow; } \/* the style will be applied to the element with id attribute set to firstname*\/ #firstname { background-color:yellow; } \/* the style will be applied to all elements*\/ * { background-color:yellow; } \/* the style will be … <\/p>\n