teclado other inspeccionar guardar elemento chrome cambios cache borrar css google-chrome

css - other - https://chrome:inspect



¿Cómo ver los archivos.css cargados en una página en Google Chrome? (6)

¿Cómo ver los archivos .css cargados en una página en Google Chrome? Puedo ver los .js (Scripts) pero no los .css


Haga clic derecho en cualquier lugar de la página y seleccione Inspect element . Desde allí, querrás hacer clic en la pestaña Resources y decirle a Chrome si siempre debe habilitar ese panel o solo una vez para la sesión (elige el que prefieras). Una vez dentro, verás todos los archivos a la izquierda. Puede ver el contenido haciendo clic en la pequeña pestaña Content lado de Headers a la derecha.


La pestaña Resources se ha ido a partir de enero de 2011 , usa la pestaña Network y filtra las solicitudes de CSS .

Respuesta original (2010)

Puede usar "Inspeccionar elemento" (clic derecho) en cualquier elemento, luego elegir la pestaña "Recursos", hacer clic en "Habilitar seguimiento de recursos para esta sesión". Luego, desde la "subpestaña" (Todos, Documentos, Imágenes, Guiones), etc., puede hacer clic en "Hojas de estilo".

Espero que esto ayude !


Ordeno ver qué archivos se han cargado, haga clic derecho en una sección en blanco de la página y seleccione Ver origen de página . Desde aquí, le mostrará la página html tal como fue mostrada por Chrome. Si busca en la sección del encabezado, debe ser una lista de todos los archivos externos que también fueron llamados, y deberían ser hipervínculos, simplemente haga clic en cualquiera de ellos y Chrome mostrará ese archivo específico en una nueva pestaña.

Buena suerte.


Si estás interesado, hay una manera de buscarlos en JS:

(Por favor use un navegador moderno)

var sts = document.styleSheets; var result = []; for (var i = 0; i < sts.length; i++) { var st = sts.item(i); result.push(st.href.match(//w*/.css/)); } console.dir(result);


Advertencia: ¡esta respuesta ahora está desactualizada! Para las versiones recientes de Chrome, verifique la respuesta de Dr1Ku a continuación.

En la pestaña Herramientas del desarrollador de Chrome (CTRL + MAYÚS + I), vaya a Recursos (es posible que deba habilitar el seguimiento de Recursos en esa página) y haga clic en la pestaña secundaria Hojas de estilo . Eso mostrará todos los archivos css cargados por esa página.


Enero de 2018

Para ver los archivos CSS cargados en una página:

  1. Ir a la pestaña Red
  2. Recargar la página
  3. Filtrar por CSS

Sé que esta es una pregunta antigua, pero la mayoría de las respuestas están desactualizadas.