How to use window.getComputedStyle() in JavaScript

The window.getComputedStyle() method can be used to get the current values of an element's CSS property. CSS properties are returned after resolving all style rules from stylesheets and other sources (include: internal style sheets, external style sheets, inherited styles and browser default styles.)

window.getComputedStyle(element);
window.getComputedStyle(element, pseudo);

// DOM element
var element = document.querySelector("#element");

// Computed Style
var styled = window.getComputedStyle(element);

// CSS "width" value
console.log(styled.getPropertyValue('width'));
console.log(styled.width);

// CSS "height" value
console.log(styled.getPropertyValue('height'));

// CSS "line-height" value
console.log(styled.getPropertyValue('line-height'));

// CSS "font-size" value
console.log(styled.getPropertyValue('font-size'));
console.log(styled.fontSize');

#css #html #stylesheet