View source for CSS3/Selectors/pseudo-classes/:nth-last-of-type

= Pseudo-class :nth-last-of-type() =

The :nth-last-of-type() pseudo-class represents an element that has ''an+b'' siblings with the same expanded element name after it in the document tree, for any zero or positive integer value of n, and has a parent element.

== Syntax ==
<pre>
selector:nth-last-of-type(an+b){ properties }
</pre>


== Point, Note ==
*The examples of ''an+b'' are as follows:
** :nth-child(2n)    /* represents every even elements that has the same expanded element name */
** :nth-child(even)  /* same, represents every even elements that has the same expanded element name */
** :nth-child(2n+1)  /* represents every odd elements that has the same expanded element name */
** :nth-child(odd)   /* same, represents every odd elements that has the same expanded element name */
** :nth-child(10n-1) /* represents the 9th, 19th, 29th, etc, elements that has the same expanded element name */


== Example ==
[style.css]
  article img:nth-of-type(2n){
    float: left;
  }
  article img:nth-of-type(2n+1){
    float: right;
  }


[index.html]
<pre>
<body>
  <article>
    <h1>This is a sample content.</h1>
    <p>This is a paragraph.</p>
    <img src="images/photo1.png" alt="">
    <h1>This is a sample content.</h1>
    <p>This is a paragraph.</p>
    <img src="images/photo1.png" alt="">
    <h1>This is a sample content.</h1>
    <p>This is a paragraph.</p>
    <img src="images/photo1.png" alt="">
  </article>
</body>
</pre>


The CSS Selectors Level 3 specification defines the :nth-of-type() pseudo-class selector in [http://www.w3.org/TR/css3-selectors/#nth-last-of-type-pseudo 6.6.5.5. :nth-last-of-type() pseudo-class].