How can I inspect element in an Android browser?

I want to inspect my website CSS/HTML elements in my Android browser.

However it will be over a smartphone or the Android SDK.

What is the best way to do it?

Chrome on Android makes it possible to use the Chrome developer tools on the desktop to inspect the HTML that was loaded from the Chrome application on the Android device.

See: https://developers.google.com/chrome-developer-tools/docs/remote-debugging

Had to debug a site for native Android browser and came here. So I tried weinre on an OS X 10.9 (as weinre server) with Firefox 30.0 (weinre client) and an Android 4.1.2 (target). I'm really, really surprised of the result.

1. Download and install node runtime from http://nodejs.org/download/
2. Install weinre: sudo npm -g install weinre
3. Find out your current IP address at Settings > Network
4. Setup a weinre server on your machine: weinre --boundHost YOUR.IP.ADDRESS.HERE
5. In your browser call: http://YOUR.IP.ADRESS.HERE:8080
6. You'll see a script snippet, place it into your site: <script src="http://YOUR.IP.ADDRESS.HERE:8080/target/target-script-min.js"></script>
7. Open the debug client in your local browser: http://YOUR.IP.ADDRESS.HERE:8080/client
8. Finally on your Android: call the site you want to inspect (the one with the script inside) and see how it appears as "Target" in your local browser. Now you can open "Elements" or whatever you want.

Maybe 8080 isn't your default port. Then in step 4 you have to call weinre --httpPort YOURPORT --boundHost YOUR.IP.ADRESS.HERE.

And I don't remember exactly when it was, maybe somewhere after step 5, I had to accept incoming connections prompt, of course.

Happy debugging

P.S. I'm still overwhelmed how good that works. Even elements-highlighting work

You can inspect elements of a website in your Android device using Chrome browser.

Open your Chrome browser and go to the website you want to inspect.

Go to the address bar and type "view-source:" before the "HTTP" and reload the page.

The whole elements of the page will be shown.

If you want to inspect html, css or maybe you need js console in your mobile browser. You can use excellent tool eruda Using it you have the same Developer Tools on your mobile browser as in your desktop device. Dont forget to upvote :) Here is a link https://github.com/liriliri/eruda

Simply bookmark this code as a link:

javascript:(function () { var script = document.createElement('script'); script.src="//cdn.jsdelivr.net/npm/eruda"; document.body.appendChild(script); script.onload = function () { eruda.init() } })();

and open the bookmark (with searching for the SAVED name in the search bar) after opening the site. The bookmark will appear on your search bar, open it, and you will have inspect element on Android.