Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>If everything were defined via CSS, have you ever thought of spawning your own <code>@font-face</code> definitions, overriding Helvetica?</p> <p>For example, if everything is defined to render in Helvetica, like in this statement:</p> <pre><code>* { font-family: Helvetica; } </code></pre> <p>You may then append a @font-face statement to your style sheet, which would now look like this:</p> <pre><code>@font-face { font-family: 'Helvetica'; src: local('Anivers-Regular'), local('Anivers Regular'), url('typeface.Anivers.Regular.otf') format('truetype'); } </code></pre> <p>It works on in-line-styled elements like <code>&lt;h4 style="font-family: Helvetica;"&gt;aw&lt;/h4&gt;</code> too.</p> <p>In that way, everything Helvetica would be automagically rendered in (, e.g.,) Anivers, and this snippet works with or without double quotes. List PostScript name, Full name + style, then an URI for cross-browser compatibility. If the fallback is on Helvetica, this CSS magic would work. Plus, you get free performance overhead in this way since the browser, instead of your script, does the substitution for you.</p> <p>Unfortunately, Internet Explorer hates .otf files for no apparent reason and you would need an utility called ttf2eot just in case.</p> <p>—</p> <p>This is an ugly hack and shall live in your production code for too long.</p> <p>By the way, what’s the scenario and why would you want to do this — substituting a better-looking typeface with an inferior one? </p> <p>If you later changed your mind and would like to use the “real” Helvetica somewhere else, you will have to swizzle it under another name. Tedious work isn’t it.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload