Selenium CSS Selector #7 – First-Child, Last-Child, Nth-Child, Nth-Last-Child

In this Selenium CSS Selector tutorial we will learn about CSS Selector Pseudo classes first-child, last-child, nth-child and nth-last-child.

A CSS pseudo-class is a keyword added to a selector that specifies a special state of the selected web-element

first-child – Returns first element from the group of sibling elements

last-child – Returns last element from the group of sibling elements

nth-child() – Returns elements based on their position in a group of siblings nth-last-child() – Returns elements based on their position among a group of siblings, counting from the end.

Selenium CSS Selector #3 – CSS Selector with Multiple Attributes

In this Selenium CSS selector tutorial we will learn how to write Selenium CSS selector using multiple attributes of the webelement.

You can write advanced CSS selectors using the mix of Tag, ID or CLASSNAME and other attributes of the webelement.

Syntax for CSS selector with multiple attributes:

tagName.classValue[AttributeName=’AttributeValue’]

tagName#idValue[AttributeName=’AttributeValue’]

Examples:

input.signup[type=’submit’][value=’Sign me up ‘]

input#submit_btn[type=’submit’][value=’Sign me up ‘]