Determining which font to use

Question

I have a paragraph with an inline style as shown below:

<p style="font-family:georgia,garamond,serif;">

My question is, is there a way to find out which font is used by my page and what is the selection procedure?

Answer 1

Dev Tools

Open the developer tools and find the computed styles, you will see which styles are applied and where ... including fonts.

• Chrome: https://developers.google.com/web/updates/2013/09/DevTools-answers-What-font-is-that
• Firefox: https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/View_fonts

font-family. , ( ) , @font-face . , , , , .

JavaScript

var el = document.getElementById("id");
var style = window.getComputedStyle(el, null).getPropertyValue("font-family");

JSFiddle

. MDN...

• https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle
• https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration/getPropertyValue

Answer 2

F12. CSS. , , .

Answer 3

. , , , , , , Garamond, , , , .

CSS , font-family, . , , , , . 1

Chrome Crtl + Shift + I, html , , .

javascript, .

Answer 4

, style

//using id

var b = document.getElementById("p").style.fontFamily;
console.log(b);

//or using jquery tag selecter

console.log($("p").css('fontFamily'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="p" style="font-family:georgia,garamond,serif;">

Hide result