Google Chrome: how to see the .css files loaded in a page ?

Question

hi,

how to see the .css files loaded in a page in google Chrome? I can see the .js (Scripts) but not the .css...

Regards

Javi

Answer 1

Hello Javi, I order to see what files have been loaded right click on a blank section on the page, and select View Page Source. From here it will show you the html page as it was rendered by Chrome. If you look in the header section you should be a list of all external file that were called in as well, and they should be hyperlinks, just click on any of them and Chrome will show that that specific file in a new tab.

Good Luck.

Answer 2

On Chrome's Developer Tools tab (CTRL + SHIFT + I), go to Resources (you may have to enable Resource tracking on that page), and click on the sub-tab Stylesheets. That will show all css files loaded by that page.

Answer 3

Hi,

You can use "Inspect Element" (right click) on any item, then choose the "Resources" Tab, click "Enable resource tracking for this session". Then from the "sub-tab" (All, Documents, Images, Scripts) etc you can click "Stylesheets".

Hope this helps !

Answer 4

Right-click anywhere on the page and select Inspect element. From there, you'll want to click the Resources tab and tell Chrome if it should always enable that panel or just once for the session (choose whichever you prefer). Once inside, you'll see all the files on the left. You can view the content by clicking the tiny Content tab next to Headers on the right.