Podemos obtener la propiedad de estilo de un elemento a través de getComputedStyle()
pero ¿hay alguna forma de detectar/rastrear desde dónde se estableció este valor: CSS del usuario o predeterminado del sistema o ninguno?
En este ejemplo, solo bakckground-color
se establece mediante la hoja de estilo del usuario, la display
se establece mediante la "hoja de estilo del agente de usuario" (también conocido como valor predeterminado del navegador) y el width
no se establece por nada, se genera automáticamente:
console.log("backgroundColor", getComputedStyle(test).backgroundColor); console.log("display", getComputedStyle(test).display); console.log("width", getComputedStyle(test).width);
#test { background-color: lightblue; }
<div id="test">test</div>
ps en DevTools hay un enlace a la hoja de estilo donde se establece la propiedad:
y muestra qué hoja de estilo establece el valor: