CSS Selector Practice

unique id

unique class

element 1

element 2

unique name

unique combination of attributes : name=a id=a

unique combination of attributes : name=a id=b

unique combination of attributes : name=b id=a

unique combination of attributes : name=b id=b

class = 'apple'

class = 'apple orange'

Example of identifying elements with help of parent

label1

label2

label3

Index

1 2 3 4 5 6 7 8 9 10

only-of-type

b1 b2 b3 l4

b1 l2 l3 l3

b1 b2 l3 l3

Difference between first child and first type

1 2 3

1 2 3

1 2 3

Xpath AXES

Xpath AXES - Inspect Me

Not logged in

This is a link

Xpath Practice

unique id

unique name

unique value

element 1

element 2

unique combination of attributes : name=a id=a

unique combination of attributes : name=a id=b

unique combination of attributes : name=b id=a

unique combination of attributes : name=b id=b

Example of Elements with nothing unique : use index

label1

label2

label3

When the child is unique

google link

Where the parent is unique

Using Elements as Attributes

Advance Xpath Example : Identify using lable only

::: Addmission

Name

Father

Mother

Email

Mobile No.

Date of Birth

DOB

Gender

Male Female

Apply For

Select Course Computer Course University Course Other Course

Address

Address

Photo

Not logged in

Xpath AXES

Xpath AXES - Inspect Me

Sample Table of Div

Select

Firstname

Lastname

Age

Jack

Bad

25

Tommy

Sad

26

Tom

Good

30

Jack

Bad

20

Eva

Strong

18

Sam

Cool

32

Jack

Bad

30

Sample webtable 3

Basic HTML Table

Select	Firstname	Lastname	Age
	Jack	Bad	25
	Tommy	Sad	26
	Tom	Good	30
	Jack	Bad	20
	Eva	Strong	18
	Sam	Cool	32
	Jack	Bad	30

Basic HTML Table

Firstname	Lastname	Age	Select
Jack	Bad	25
Tommy	Sad	26
Tom	Good	30
Jack	Bad	20
Eva	Strong	18
Sam	Cool	32
Jack	Bad	30

Sample webtable 2

Basic HTML Table

Select	Firstname	Lastname	Age
	Jack	Bad	25
	Tommy	Sad	26
	Tom	Good	30
	Eva	Strong	18
	Sam	Cool	32

Sample webtable 1

Basic HTML Table

Select	Firstname	Lastname	Age
	Tom	Good	30
	Jack	Bad	25
	Eva	Strong	18
	Sam	Cool	32
	Tommy	Sad	26

Mix of Basic WebElements

This is an example of paragraphs

This paragraph contains a lot of lines in the source code, but the browser ignores it.

This paragraph contains a lot of spaces in the source code, but the browser ignores it.

This is an example of paragraphs with a span inside

This is an example of labels

label1

label2

label3

This is an example of link

google link

This is an example of Text box

User id: Password:

This is an example of Radio buttons

Kindly Select your favorite color

Red
blue
green
pink

This is an example of Checkbox

Kindly Select your favorite sports

Cricket
Tennis
Football
Baseball
Badminton

The select dropdown

Select your favorite fruit: Apple Orange Pineapple Banana

Selected fruit is :

Basic dropdown

The select dropdown

Select one option at a time:

Select your favorite fruit: Apple Orange Pineapple Banana

Selected fruit is :

The Multi Select Element

The multiple attributes specify that multiple options can be selected at once:

Choose a car: Volvo Saab Opel Audi

Selected car is :

Hold down the Ctrl (windows) or Command (Mac) button to select multiple options.