The :last-of-type
CSS pseudo-class represents the last sibling with the given element name in the list of children of its parent element.
:last-of-type { style properties }
To match the last em
element inside a <p>
element, you can use this:
p em:last-of-type { color: lime; }
<p> <em>I'm not lime :(</em> <strong>I'm not lime :(</strong> <em>I'm lime :D</em> <strong>I'm also not lime :(</strong> </p> <p> <em>I'm not lime :(</em> <span><em>I am lime!</em></span> <strong>I'm not lime :(</strong> <em>I'm lime :D</em> <span><em>I am also lime!</em> <strike> I'm not lime </strike></span> <strong>I'm also not lime :(</strong> </p>
...will result in:
Specification | Status | Comment |
---|---|---|
Selectors Level 4 The definition of ':last-of-type' in that specification. | Working Draft | No change |
Selectors Level 3 The definition of ':last-of-type' in that specification. | Recommendation | Initial definition |
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 1.0 | 3.5 (1.9.1) | 9.0 | 9.5 | 3.2 |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | 2.1 | 1.0 (1.9.1) | 9.0 | 10.0 | 3.2 |
© 2005–2017 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/:last-of-type