How to get the actual rendered font when it’s not defined in CSS?

by

I suggest this function:

function css( element, property ) {
    return window.getComputedStyle( element, null ).getPropertyValue( property );
}

Usage:

css( object, 'font-size' ) // returns '16px' for instance

Note: getComputedStyle doesn’t work in IE8.

Live demo: http://jsfiddle.net/4mxzE/

console.log(
  getComputedStyle(document.getElementById('test'), null)
    .getPropertyValue('font')
)
#test {
  font-family: fantasy, cursive;
}
<div id="test">Lorem ipsum dolor sit font-face</div>

More Related Contents:

  1. list every font a user’s browser can display
  2. How to detect which one of the defined font was used in a web page?
  3. How to change FontSize By JavaScript?
  4. Preloading @font-face fonts?
  5. How to display an chage photo option on mouse hover similar to linkedin using Javascript? [closed]
  6. How to force browser to show image 3 inches wide?
  7. Syntax Higlighter For Site [closed]
  8. Cache busting via params
  9. Remove CSS class from element with JavaScript (no jQuery) [duplicate]
  10. Select all elements that have a specific CSS, using jQuery
  11. Why is deprecated and what is the best alternative?
  12. Detecting that the browser has no mouse and is touch-only
  13. Ellipsis in the middle of a text (Mac style)
  14. Prevent Address-Bar hiding in mobile Browsers
  15. Read CSS property of an element using JavaScript
  16. how to disable DIV element and everything inside [duplicate]
  17. How Do I Stop My Web Content From Shifting Left When The Vertical Scrollbar Appears? Roll-Up of Advice 2017 [duplicate]
  18. Load HTML page dynamically into div with jQuery
  19. jQuery position DIV fixed at top on scroll
  20. Bootstrap modal: background jumps to top on toggle
  21. How To Include CSS and jQuery in my WordPress plugin?
  22. Inject CSS stylesheet as string using Javascript
  23. Why does querySelector only select the first element and how can I fix this?
  24. Override styles in a shadow-root element
  25. Extracting text from a contentEditable div
  26. How to remove jQuery Mobile styling?
  27. Google map custom marker with css rounded corner
  28. Perspective transform of SVG paths (four corner distort)
  29. Setting the height of a DIV dynamically
  30. Center an Image vertically and horizontally using CSS

Leave a Comment