tools quitar inspeccionar guardar elemento developer dev debug chrome cambios google-chrome-devtools

google-chrome-devtools - quitar - inspeccionar elemento chrome guardar cambios



Las herramientas de desarrollo de Google Chrome inspeccionan los estilos de elementos que no se muestran (10)

Comenzando hace un par de semanas ... en algunos de nuestros sitios, pero no en todos, al inspeccionar un elemento, la pestaña de estilos solo muestra el "cuadro de estilos", pero no los estilos reales relacionados con css. - De nuevo, esto es SOLO en algunos sitios - raro

Debería verse así (con estilos que se muestran a la derecha relacionados con CSS)

PERO ... en cambio, en ALGUNOS de nuestros sitios, esto acaba de comenzar hace un par de semanas con este aspecto ... sin css en la pestaña de estilos:

NOTA: ha funcionado durante 2 años: la página se ve bien y todos los estilos se están aplicando al DOM, pero NO se muestran en la pestaña de estilos al inspeccionar el elemento.

¿¿Algunas ideas??


Acabo de tener este mismo problema y para resolverlo entré en Herramientas para desarrolladores de Chrome -> Configuración -> Desplácese hasta la parte inferior y haga clic en "Restaurar valores predeterminados y volver a cargar" , ¡y todo volvió mágicamente!

No había cambiado nada entre que funcionaba y cuándo se detuvo, así que no estoy seguro de por qué se rompió, pero espero que esto también te ayude.


Creo que esto puede ser útil ... Si se trata de un proyecto angular> simplemente ejecute

ng serve --extract-css.


Creo que sus archivos CSS no están cargados correctamente. Simplemente verifique la sintaxis para hacer referencia a las hojas de estilo externas.

Debería ser así

<link rel="stylesheet" type="text/css" href="mystyle.css">

Si omite la rel = "hoja de estilo", el navegador puede pensar que es un archivo simple. Para confirmar la carga de hojas de estilo, vaya a Chrome Inspector -> Fuentes

Consulta los recursos del sitio

No es necesario reiniciar nada. Espero eso ayude :)


Estaba teniendo el mismo problema extraño. No estoy 100% seguro de lo que provocó que esto sucediera, pero utilizamos herramientas de compilación para construir SCSS en CSS. Entré en mi archivo CSS y eliminé la referencia del mapa de origen:

/*# sourceMappingURL=myCSS.map */

Y de repente comenzó a aparecer de nuevo. Luego lo agregué y aún puedo verlo. No estoy seguro de si esto se debe a que una versión del mapa está en caché ahora o no, pero esto funcionó para mí.


Incluso me enfrenté a este problema !!!

El archivo style.css estaba causando este problema.

Acabo de crear un nuevo archivo css (Ej: style1.css) y corté pegado el contenido del archivo css anterior (todas las líneas en style.css) al archivo style1.css. Funciona

Nota: No olvide actualizar la etiqueta de enlace, que está cargando el archivo CSS.


Solo cierro la pestaña, la vuelvo a abrir, y luego hago clic derecho> inspeccionar elemento. No es necesario restaurar todas las herramientas de desarrollo a la configuración predeterminada. Es un desperdicio. Pruébalo, funciona! :)


También estaba enfrentando este problema, además de las sugerencias que los otros usuarios hicieron, funcionó para que yo accediera:

Herramientas para desarrolladores de Chrome -> CSS -> Relaoad Hojas de estilo vinculadas

Imagen que ilustra el procedimiento


Tuve que ir a Chrome Developer Tools -> Settings -> Enable JavaScript source maps para Chrome Developer Tools -> Settings -> Enable JavaScript source maps y luego deshabilitar esa casilla de verificación. Probablemente tenga que ver con los mapas fuente y el hecho de que estoy construyendo el scss a css .


Yo uso Dreamweaver y Breckets. Pude ver que el problema ocurrió solo cuando usé Dreamweaver. Resolvió el problema cambiando las preferencias de Dreamweaver

-> Formato de código -> Tipo de salto de línea -> CR LF (Windows)


algo que funcionó para mí: chrome: flags> Activar experimentos de Developer Tools> Desactivar. Lo había habilitado en algún momento, lo usé durante años sin problemas, luego no pude ver ningún detalle de estilo como lo describió OP. Después de actualizar, restablecer las preferencias de devtools a las predeterminadas, incluso probar de incógnito, esto fue lo único que pareció que volviera a funcionar. Hubo algunos experimentos interesantes, pero preferiría poder hacer mi trabajo ...