Skip to main content

How to find CSS selector

The easist way to get a web page area's CSS selector is by using Chrome browser.

  1. If you do not have Chrome browser installed yet, go to here to download and install.

  2. Open a web page, then press Ctrl + Shift + C (Windows/Linux) / Command + Option+ C (Mac). Move your mouse so that the blue shaded area covers the area where you want to detect changes to the page, and then click the left mouse button. You will see that the corresponding piece of code in the code area below is also shaded blue.

  1. In the blue shaded code area below, click the right mouse button, find "Copy", find "Copy selector", and click the left mouse button.

  2. Then you got the CSS selector value, it is on your clipboard now. You can paste the CSS selector value to web-page-monitor's create task page's CSS selector input field.

If above keyboard shortcuts have no effect,or you do not have a keyboard, see below.

  1. In Chrome browser, right click a web page, then click "Inspect". ( Or, press Ctrl + Shift + I (Windows/Linux) / Command + Option+ J (Mac). )

  2. Click the small icon with a small arrow, then click .

  3. Then you should read step 2, go on moving your mouse and let blue shaded area covers the area you wanna check.