HomeSelenium

Selenium Locators – What is a CSS Selector?

Selenium Locators – What is a CSS Selector?

<<Previous Post                            << Complete Tutorial>>                              Next Post>>

In the previous articles, I have explained the usage of XPath Expression locators in detail.

If you have already gone through the previous XPath Expression locator articles, the learning of CSS Selectors will become easier for you.

In this article, I am going to explain – ‘What exactly is a CSS Selector ?

Let’s get started.

Selenium Locators – What is a CSS Selector?

Similar to XPath Expressions, CSS Selectors are also one type of locators.

As you already know, CSS Selectors are the locators having more priority over XPath Expressions.

I will explain more about the reason behind this priority in the upcoming articles.

Now in this article, I will explain – ‘What exactly is a CSS Selector?’

CSS stands for Cascading Style Sheets.

While HTML is used for structuring/organizing the web elements on the web page, CSS is generally used to style the web elements (i.e. Color, Size, Font Family, Background Color, etc.).

Note: We don’t have to learn CSS for understanding these CSS Selectors.

As you have understood, the purpose of CSS, let’s understand ‘What is a CSS Selector?

CSS Selectors are patterns similar to XPath Expressions, whose actual purpose in web development is to locate the UI elements on the web page for applying the styles (i.e. Color, Size, Font Family, Background Color, etc.)

Example for a CSS Selector:   input[name=’q’]

Observe that the above CSS Selector example looks similar to XPath Expression with small differences. I will explain the differences between CSS Selector Syntax and XPath Expression Syntax in the upcoming articles.

We will use the same locating strategy in Selenium for locating the UI elements on the web pages.

Hope you understood ‘What is a CSS Selector?’ in this article and in the next article, I will explain the different types of CSS Selectors.

Next Steps:

  • > To learn more about Selenium, continue to the next post (Click on Next Post link below)
  • > Check complete Selenium Tutorial Contents here (Click here)

Please leave your questions/comments/feedback below.

Happy Learning 🙂

About Me > Arun Motoori

On a mission to contribute to the Software Testing Community in all possible ways.

<<Previous Post                            << Complete Tutorial>>                              Next Post>>

If you like this article, share it on LinkedIn using the below button:

Comments (0)

Leave a Reply

Your email address will not be published. Required fields are marked *