pseudo classes

pseudo-classes.css

/* link to the source: http://webdesign.about.com/od/css3/qt/alternating-row-styles-tables.htm */
/* http://www.w3schools.com/css/css_pseudo_classes.asp */
/*table http://webdesign.about.com/od/tables/ss/aa120897.htm */
/* Select the last 4 element from a list */ 
li:nth-last-child(-n+4) { background-color: #ccc; }

/* zebra */
li:nth-child(odd){background-color: #eee;}
li:nth-child(even){background-color: #ddd;}
/* zebra rows in table */
tr:nth-of-type(odd) { background-color: #ccc; }
/* zebra columns in table */
td:nth-of-type(even) { background-color:#ccc; }

/* alternate image */
img:nth-of-type(odd) { float: left; }
img:nth-of-type(even) { float: right; }


/* Paragraph in 4 Different Colors */
p:nth-child(4n+1) { color: green; }
p:nth-child(4n+2) { color: orange; }
p:nth-child(4n+3) { color: violet; }
p:nth-child(4n+4) { color: red;}

/* utf8  http://utf8-zeichentabelle.de */
blockquote:before,  blockquote:after
{
    content: "»";
    font-size: 2.8em;
    color:Purple;
}
blockquote:after
{
    content: "«";
}

/* add a image after rel type extern to a link */
a[rel=extern]:after {
   content: "" url(ext_link.png);
}
/* http://www.w3.org/TR/CSS2/selector.html */
/* Child selectors  with > */
/* select all p child elements from body */
body > P { line-height: 1.3 }

/* sibling selectors  with + */
h1.opener + h2 { margin-top: -5mm }   

// with JQuery zebra and css seletor style
$("tr:nth-child(odd)").addClass("odd");
$("tr:nth-child(even)").addClass("even");