Suppose I have the following CSS rule in my page:
<code><span class="pln">body </span><span class="pun">{</span>
    <span class="kwd">font-family</span><span class="pun">:</span><span class="pln"> Calibri</span><span class="pun">,</span><span class="pln"> Trebuchet MS</span><span class="pun">,</span><span class="pln"> Helvetica</span><span class="pun">,</span><span class="pln"> sans-serif</span><span class="pun">;</span>
<span class="pun">}</span></code>
How can I detect which one of the defined fonts was used in the user’s browser? Edit for people wondering why I want to do this: The font I’m detecting contains glyph’s that are not available in other fonts and when the user does not have the font I want to display a link asking the user to download that font so they can use my web application with the correct font. Currently I am displaying the download font link for all users, I want to only display this for people who do not have the correct font installed.