Saya membuat ikon Facebook kustom menggunakan Inkscape dan menyimpannya sebagai svg. Ia menggunakan font yang sama dengan judul halaman saya, yang menggunakan font "ubuntutitling-bold-webfont", yang saya rujuk sebagai .woff dalam file CSS. Judul berfungsi, tetapi svg tidak - ia menampilkan "f" dalam beberapa jenis font default. File font terletak di ...
Saya menemukan Bagaimana cara menyematkan Font Web Google ke dalam SVG? , tapi saya agak bingung tentang cara menerapkan kode ke SVG, jika saya perlu. Bisakah SVG menggunakan font .woff yang direferensikan dalam file CSS? Apakah cara saya mengubah font di dalam file SVG secara manual benar?
Berikut adalah kode untuk SVG:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="80"
height="80"
id="svg2"
version="1.1"
inkscape:version="0.48.3.1 r9886"
sodipodi:docname="New document 1">
<defs
id="defs4" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1"
inkscape:cx="26.573808"
inkscape:cy="42.478414"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:window-width="1619"
inkscape:window-height="611"
inkscape:window-x="165"
inkscape:window-y="301"
inkscape:window-maximized="0" />
<metadata
id="metadata7">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0.75006053,-981.36219)">
<rect
style="fill:#000000;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0"
id="rect2987"
width="70"
height="70"
x="4.2499394"
y="986.36218"
rx="10"
ry="10" />
<text
xml:space="preserve"
style="font-size:109.44319916px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:#fffffe;stroke-width:2.73607969;stroke-opacity:1;font-family:ubuntutitling-bold-webfont';-inkscape-font-specification:ubuntutitling-bold-webfont'"
x="25.989071"
y="1096.0118"
id="text3757"
sodipodi:linespacing="125%"
transform="scale(1.0381556,0.96324674)"><tspan
sodipodi:role="line"
id="tspan3759"
x="25.989071"
y="1096.0118"
style="stroke-width:2.73607969">f</tspan></text>
</g>
</svg>
Terima kasih sebelumnya.