6

I am trying to figure out how to inspect an element using Chrome. Now I know how to inspect an element, but how do I inspect a button's functions, like hover and active as well.

I am trying to inspect the Youtube's sign-in button on the top left of the page. I got the hover attributes, but how do I inspect the link and active state attributes?

1
  • You could simply view the source of the page, get the sylesheet and search for the class/ID in the stylesheet. Commented Sep 14, 2012 at 16:22

2 Answers 2

14

When you're inspecting the element, in the styles tab, there's a "toggle element state" button. Click it to apply various pseudo-states:

Sign up to request clarification or add additional context in comments.

1 Comment

Ohhh ok thank you so much I am new to inspecting elements. Sweet@!
4

Just right click anywhere on a page and choose "Inspect element" from the menu. Chrome has a graphical tool for debugging (like in Firebug), so you can debug JavaScript or look at CSS (you can even temporarily change the CSS while you're there too)

For more information, see https://developers.google.com/chrome-developer-tools/

3 Comments

In fact, the current Chromium/Chrome Code Inspector is the best one on the market. Faster than Firebug or Dragonfly and much more features as the MS IE developer tools.
Like I said I know how to inspect element but when I do all it shows is the hover CSS attributes how or where do I pull up the link and active states of the button?
Ah sorry, well in that case Abody beat me to it!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.