snipt

Ctrl+h for KB shortcuts

CSS+PHP

@font-face

1
2
3
4
5
6
7
8
@font-face {
  font-family: "Your typeface";
  src: url("type/filename.eot");
  src: local("Alternate name"), local("Alternatename"),
    url("type/filename.woff") format("woff"),
    url("type/filename.otf") format("opentype"),
    url("type/filename.svg#filename") format("svg");
  }
https://snipt.net/embed/d5a347be4c9abba4030abace56d186cf/
/raw/d5a347be4c9abba4030abace56d186cf/
d5a347be4c9abba4030abace56d186cf
css+php
CSS+PHP
8
2019-08-19T10:34:41
True
False
False
/api/public/snipt/14141/
font-face-2
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a> <a href="#L-2">2</a> <a href="#L-3">3</a> <a href="#L-4">4</a> <a href="#L-5">5</a> <a href="#L-6">6</a> <a href="#L-7">7</a> <a href="#L-8">8</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="k">@font-face</span> <span class="p">{</span> </span><span id="L-2"><a name="L-2"></a> <span class="nt">font-family</span><span class="o">:</span> <span class="s2">&quot;Your typeface&quot;</span><span class="o">;</span> </span><span id="L-3"><a name="L-3"></a> <span class="nt">src</span><span class="o">:</span> <span class="nt">url</span><span class="o">(</span><span class="s2">&quot;type/filename.eot&quot;</span><span class="o">);</span> </span><span id="L-4"><a name="L-4"></a> <span class="nt">src</span><span class="o">:</span> <span class="nt">local</span><span class="o">(</span><span class="s2">&quot;Alternate name&quot;</span><span class="o">),</span> <span class="nt">local</span><span class="o">(</span><span class="s2">&quot;Alternatename&quot;</span><span class="o">),</span> </span><span id="L-5"><a name="L-5"></a> <span class="nt">url</span><span class="o">(</span><span class="s2">&quot;type/filename.woff&quot;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s2">&quot;woff&quot;</span><span class="o">),</span> </span><span id="L-6"><a name="L-6"></a> <span class="nt">url</span><span class="o">(</span><span class="s2">&quot;type/filename.otf&quot;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s2">&quot;opentype&quot;</span><span class="o">),</span> </span><span id="L-7"><a name="L-7"></a> <span class="nt">url</span><span class="o">(</span><span class="s2">&quot;type/filename.svg#filename&quot;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s2">&quot;svg&quot;</span><span class="o">);</span> </span><span id="L-8"><a name="L-8"></a> <span class="p">}</span> </span></pre></div> </td></tr></table>
font, font-face

CSS

CSS font-face embedding

1
2
3
4
5
6
7
8
@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('Graublau Web Regular'), local('Graublau Web'),
  url('GraublauWeb.otf') format('opentype');
}

/* From “Bulletproof @font-face syntax” at paulirish.com. */
https://snipt.net/embed/6c352b94d941dc538fb01da5fc75f97e/
/raw/6c352b94d941dc538fb01da5fc75f97e/
6c352b94d941dc538fb01da5fc75f97e
css
CSS
8
2019-08-20T23:09:45
True
False
False
/api/public/snipt/10532/
css-font-face-embedding
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1">1</a> <a href="#L-2">2</a> <a href="#L-3">3</a> <a href="#L-4">4</a> <a href="#L-5">5</a> <a href="#L-6">6</a> <a href="#L-7">7</a> <a href="#L-8">8</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="k">@font-face</span> <span class="p">{</span> </span><span id="L-2"><a name="L-2"></a> <span class="nt">font-family</span><span class="o">:</span> <span class="s1">&#39;Graublau Web&#39;</span><span class="o">;</span> </span><span id="L-3"><a name="L-3"></a> <span class="nt">src</span><span class="o">:</span> <span class="nt">url</span><span class="o">(</span><span class="s1">&#39;GraublauWeb.eot&#39;</span><span class="o">);</span> </span><span id="L-4"><a name="L-4"></a> <span class="nt">src</span><span class="o">:</span> <span class="nt">local</span><span class="o">(</span><span class="s1">&#39;Graublau Web Regular&#39;</span><span class="o">),</span> <span class="nt">local</span><span class="o">(</span><span class="s1">&#39;Graublau Web&#39;</span><span class="o">),</span> </span><span id="L-5"><a name="L-5"></a> <span class="nt">url</span><span class="o">(</span><span class="s1">&#39;GraublauWeb.otf&#39;</span><span class="o">)</span> <span class="nt">format</span><span class="o">(</span><span class="s1">&#39;opentype&#39;</span><span class="o">);</span> </span><span id="L-6"><a name="L-6"></a><span class="p">}</span> </span><span id="L-7"><a name="L-7"></a> </span><span id="L-8"><a name="L-8"></a><span class="c">/* From “Bulletproof @font-face syntax” at paulirish.com. */</span> </span></pre></div> </td></tr></table>
css, embedding, font-face