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.
Adjacent sibling combinator (+) separates two CSS selectors and matches the second webelement only if it immediately follows the first webelement, and both are the child of same parent webelement.
Next Sibling elements are located using the + operator.
In this CSS selector tutorial we will learn how to find direct child and sub-child elements.
Child combinator is used to select direct child and Descendant combinator is used to select Child or Sub-child.
In this Selenium CSS Selector tutorial we will learn how to identify webelements using sub-string matches in Selenium.
Sub-string matches are very helpful in identifying dynamic webelements with the help of partial string matches.
The 3 important special characters in css sub-string selectors are:
‘^’ Sign – Signify’s the prefix of the text
‘$’ Sign – Signify’s the suffix of the text
‘*’ Sign – Signify’s the sub-string of the text
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:
input.signup[type=’submit’][value=’Sign me up ‘]
input#submit_btn[type=’submit’][value=’Sign me up ‘]