Note that there are some explanatory texts on larger screens.

plurals
  1. POCan @fontface be used within a tag? (for email signature reliability)
    primarykey
    data
    text
    <p>I am working on getting an email signature to take a custom look. It irks me that that I am compelled to go this route by the inconsistent rendering of email clients, but is there a way to make <code>@fontface</code> apply fonts to text by declaring the font style within a tag itself? Doing it the standards way (either with the styling in a header or within the HTML body) does not get the font to render on mobile email clients, though it does on some desktop apps. </p> <p><strong>I tried styling within the tag. (sample below) In theory this could work, but does not come out nicely on a browser. Should I let this one go, or are there better ways I am missing?</strong></p> <p>And just for clarity, this <code>@fontface</code> syntax does work for me when put in a correctly done style tag. Below is my attempt at defining it within the tag which yields weird results. Non-font styling comes through nicely, but the font gets put in as <code>Times</code>, not <code>Tiemann</code>. (Look at the <code>"C"</code> and the <code>"Í"</code> to tell them apart.)</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-16be-with-bom" /&gt; &lt;title&gt;Untitled&lt;/title&gt; &lt;meta name="generator" content="BBEdit 10.5" /&gt; &lt;/head&gt; &lt;body&gt; &lt;span style="@font-face font-family:'Tiemann'; src: url('https://dl.dropboxusercontent.com/u/35370696/font_embed/tiemannlightwebfont.eot'); src: url('https://dl.dropboxusercontent.com/u/35370696/font_embed/tiemannlightwebfont.eot?#iefix') format('embedded-opentype'), url('https://dl.dropboxusercontent.com/u/35370696/font_embed/tiemannlightwebfont.woff') format('woff'), url('https://dl.dropboxusercontent.com/u/35370696/font_embed/Tiemann_Light.ttf') format('truetype'), url('https://dl.dropboxusercontent.com/u/35370696/font_embed/tiemannlightwebfont.svg#Tiemann') format('svg'); font-size:22pt; color:#6D6D6D; float:left; "&gt; DIACRÍTICA &lt;/span&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    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.
 

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