Skip to content

Instantly share code, notes, and snippets.

@nagaki
Created October 1, 2013 08:37
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nagaki/6775493 to your computer and use it in GitHub Desktop.
Save nagaki/6775493 to your computer and use it in GitHub Desktop.
SVG FontのXML書式とスタイルシートからの呼び出し方
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Example</title>
<style>
@font-face {
font-family: 'Example Sans Serif';
src: url(g.svg) format('svg');
font-weight: normal;
font-style: normal;
}
p {
font-family: 'Example Sans Serif';
font-size: 10em;
}
</style>
</head>
<body>
<p>abcdefg</p>
</body>
</html>
Display the source blob
Display the rendered blob
Raw
<?xml version="1.0" standalone="yes"?>
<svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
<defs>
<font id="Font" horiz-adv-x="20" horiz-origin-x="1" horiz-origin-y="5">
<font-face
font-family="Example Sans Serif"
font-weight="normal"
font-style="normal"
units-per-em="20">
</font-face>
<glyph unicode="g"
horiz-adv-x="10"
d="
M0,9
a4,4,0,1,0,8,0
a4,4,0,1,0,-8,0z
M2,9
a2,2,0,1,1,4,0
a2,2,0,1,1,-4,0z
M6,12
a1,1,0,0,0,2,0
v-8
a4,4,0,0,0,-8,0
a1,1,0,0,0,2,0
a2,2,0,0,1,4,0
v8z
"
/>
</font>
</defs>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment