SVG にとってフォントの確実な配信は要求事項になる。デザイナーにとっては SVG 内容を任意のフォントで作成しつつ、末端利用者のコンピュータに必要なフォントがインストールされていなくとも同じグラフィック結果が現れるようにすることが必要になる。このことは印刷の世界に類似する。デザイナーは印刷用の絵図の作成に際し与えられたフォントを利用し、印刷においてはデザイナーの文書作成システムに現れるものと正確に同じグラフィック内容が現れる。 Reliable delivery of fonts is a requirement for SVG. Designers need to create SVG content with arbitrary fonts and know that the same graphical result will appear when the content is viewed by all end users, even when end users do not have the necessary fonts installed on their computers. This parallels the print world, where the designer uses a given font when authoring a drawing for print, and the graphical content appears exactly the same in the printed version as it appeared on the designer's authoring system.
歴史的に行われてきた一つのアプローチはすべてのテキストを利用されるグリフを表現するパスに変換するものである。これは視覚的な見え方を維持するが、テキストは失われることを意味し、動的な更新もアクセスもできなくなる。別のアプローチは、与えられた名前のフォントがすべての出力システムで利用できることを期待するものである。この前提は、デスクトップ環境ではあまり上手く働かない上に、雑多なモバイル環境では非常に具合が悪い。 SVG はテキストをパスに変換しつつ、それらのパスを SVG フォントとして格納できるようにすることで、この問題を解決する。テキストは維持され、動的な変更やアクセスも可能になる。 Historically, one approach has been to convert all text to paths representing the glyphs used. This preserves the visual look, but means that the text is lost; it cannot be dynamically updated and is not accessible. Another approach is to hope that a font with a given name is available to all renderers. This assumption does not work well on the desktop and works very badly in a heterogeneous mobile environment. SVG solves this problem by allowing the text to be converted to paths, but storing those paths as an SVG font. The text is retained and remains dynamically modifiable and accessible.
SVG では、"Cascading Style Sheets (CSS) level 2" 仕様 [CSS2] で定められた WebFonts の XML 版の機能をフォントの参照に利用する。記述されるフォントは種々の異なる形式に属し得る。ファミリ名, ウェイト, イタリック体かどうか, 等々のフォントの主要な仔細を記述することにより、テキストは各テキストのスパンで利用されるフォントを明示的に指示すること無くフォントプロパティを利用し続けられるようになる。 【 WebFonts はリンク先の最新版 CSS 2.1 では削除されているので CSS 2.0 の フォントの章 の方を参照されたし。この章のフォント記述子, @font-face の機能も同様。】 SVG utilizes an XML version of the WebFonts facility defined in the "Cascading Style Sheets (CSS) level 2" specification [CSS2] to reference fonts. Described fonts may be in a variety of different formats. By describing key details of the font such as its family name, weight, whether it is italic and so on, text can continue to use the font properties without having to explicitly indicate the font that is to be used for each span of text.
現今の WebFonts の枠組みにおける欠点の一つは、 "Cascading Style Sheets (CSS) level 2" [CSS2] などの仕様が、特定のフォント形式のサポートを要求していない所にある。その結果、異なる実装が異なる WebFonts をサポートすることになり、ウェブサイト作成者にとってはすべての UA と互換性がとれる WebFonts を利用する単一のウェブサイト構築が難しくなってしまったことである。 One disadvantage to the WebFont facility to date is that specifications such as [CSS2] do not require support of particular font formats. The result is that different implementations support different Web font formats, thereby making it difficult for Web site creators to post a single Web site using WebFonts that work across all user agents.
すべての 適合 SVG ビューア からのサポートが保証される共通のフォント形式を提供するため、 SVG は SVG の中で、グリフに対しパス要素に利用されているものと同じ幾何学的な仕組みを利用するフォント形式を定義する。このファシリティは SVG フォント と呼ばれる。 SVG の実装は SVG フォント形式をサポートしなければならない。また、他の形式をサポートしてもよい。 WebFonts を、それを利用する SVG 文書内、あるいは(例えば同じフォントを複数の SVG 文書間で共有するために)別個の文書内に格納してもよい。 To provide a common font format for SVG that is guaranteed to be supported by all conforming SVG viewers, SVG also defines a font format, in SVG, which uses the same geometric mechanism for glyphs as is used by the SVG path element. This facility is called SVG fonts. SVG implementations must support the SVG font format, and may also support other formats. WebFonts may be contained in the SVG document which uses them, or stored in a separate document (for example, to allow sharing of the same font by multiple SVG documents).
これら2つの仕組みを併せることでグラフィックの豊かさとテキストデータへのアクセス性を確保しつつ、末端利用者への信頼度の高いフォントデータ配信が確実になる。例えば一般的な利用として SVG 文書作成アプリケーションが SVG 文書片に現れるすべてのテキスト要素のための圧縮してサブセット化された WebFonts を生成することが考えられる。 SVG フォントにより、テキストを表現するグラフィックの意味内容の豊さを向上させられるようになる。例えば多くの会社のロゴでは意匠を凝らした社名が描かれる。ロゴを SVG フォントの一連のグリフとして表し、このフォントを参照する text 要素として描画させることで アクセシビリティ の向上を図れる局面もある。 Taken together, these two mechanisms ensure reliable delivery of font data to end users, preserving graphical richness and enabling accessible access to the textual data. In a common scenario, SVG authoring applications generate compressed, subsetted WebFonts for all text elements used by a given SVG document fragment. SVG fonts can improve the semantic richness of graphics that represent text. For example, many company logos consist of the company name drawn artistically. In some cases, accessibility may be enhanced by expressing the logo as a series of glyphs in an SVG font and then rendering the logo as a 'text' element which references this font.
SVG フォントは SVG の font 要素を用いて定義されるフォントである。 An SVG font is a font defined using SVG's 'font' element.
SVG フォントの目的は「表示システムだけ」の環境に対しグリフの外形線を配信可能にする所にある。ウェブページに付随する SVG フォントは、閲覧と表示目的でのみサポートされなければならない。グラフィック編集アプリケーションやファイル変換ツールは SVG フォントのシステムフォントへの変換を試みてはならない。 The purpose of SVG fonts is to allow for delivery of glyph outlines in display-only environments. SVG fonts that accompany Web pages must be supported only in browsing and viewing situations. Graphics editing applications or file translation tools must not attempt to convert SVG fonts into system fonts.
SVG フォントにはフォント外形線にヒント情報が無い。このため、多くの実装ではフォントサイズが小さいときのテキストの品質と読み易さが制限されることになる。内容製作者にとってはフォントサイズが小さいときの品質と読み易さの向上のため、オペレーティングシステムに同梱されるフォントや代替 WebFont [CSS2] 形式によるフォントなど、他のフォント技術の利用が望ましい場合もある。 SVG fonts contain unhinted font outlines. Because of this, on many implementations there will be limitations regarding the quality and legibility of text in small font sizes. For increased quality and legibility in small font sizes, content creators may want to use an alternate font technology, such as fonts that ship with operating systems or an alternate WebFont format.
SVG フォントは SVG 要素 と属性を用いて記述されるので、 SVG フォントの方がフォントデータがかさばらないように特に設計された形式のフォントより容量が大きくなることがある。内容製作者にとってはウェブページの高速な配信のためには、第一候補として(相互運用性のために予備の SVG フォントも備えた)他のフォント技術が望ましい場合もある。 Because SVG fonts are expressed using SVG elements and attributes, in some cases the SVG font will take up more space than if the font were expressed in a different format which was especially designed for compact expression of font data. For the fastest delivery of Web pages, content creators may want to use an alternate font technology as a first choice, with a fallback to an SVG font for interoperability.
SVG フォントの真価は SVG-UA において利用可能なことが保証される点にある。状況によっては SVG フォントをテキスト描画の第一候補にすることが適切になる。他の状況では SVG フォントが第一候補のフォント(ヒント情報付きのシステムフォントかもしれない)が利用者環境で利用できない場合のための予備の代替フォントになり得る。 A key value of SVG fonts is guaranteed availability in SVG user agents. In some situations, it might be appropriate for an SVG font to be the first choice for rendering some text. In other situations, the SVG font might be an alternate, back-up font in case the first choice font (perhaps a hinted system font) is not available to a given user.
SVG フォントの特徴と属性は CSS2 [CSS2] 仕様の 「フォント」 [CSS2] の章で述べられているフォントの特徴とパラメタに緊密に対応する。このモデルにおいては、アドバンス値と基底線の位置やグリフの外形線などの種々のフォントに関する計量は、同じサイズで印字する際に意図される行の高さ(横書きの場合)を1辺の長さとする抽象的な正方形に相対的な単位で表される。この正方形は エム平方( em square )と呼ばれ、グリフの外形線を定義するためのデザイン格子になる。 font 要素の units-per-em 属性の値はエム平方が単位に分割される数を指定する。他の種類のフォントに一般的な値としては、例えば 250(Intellifont), 1000(Type 1), 2048(TrueType, TrueType GX, Open-Type)などがある。 SVG の標準のグラフィックスの初期座標系ではY軸が下向き( 初期座標系 を見よ)になるのに反し、普及している多くのフォント形式が従う業界慣行と整合させるため、 SVG フォントのデザイン格子が従うグリフの初期座標系のY軸は上向きになる。 The characteristics and attributes of SVG fonts correspond closely to the font characteristics and parameters described in the "Fonts" chapter of the "Cascading Style Sheets (CSS) level 2" specification [CSS2]. In this model, various font metrics, such as advance values and baseline locations, and the glyph outlines themselves, are expressed in units that are relative to an abstract square whose height is the intended distance between lines of type in the same type size. This square is called the em square and it is the design grid on which the glyph outlines are defined. The value of the 'units-per-em' attribute on the 'font' element specifies how many units the em square is divided into. Common values for other font types are, for example, 250 (Intellifont), 1000 (Type 1) and 2048 (TrueType, TrueType GX and Open-Type). Unlike standard graphics in SVG, where the initial coordinate system has the y-axis pointing downward (see The initial coordinate system), the design grid for SVG fonts, along with the initial coordinate system for the glyphs, has the y-axis pointing upward for consistency with accepted industry practice for many popular font formats.
SVG フォントと関連付けられるグリフは包含ボックスについての情報を指定しない。グリフの外形線は SVG のパス要素として記述されるので、実装はグリフの描画に際し標準のグラフィックス描画か専用のフォント描画技術のどちらを利用するか選択できる。後者の場合、必要になる最大の包含ボックスとオーバーハング(overhang)の計算はグリフの外形線に含まれるパス要素を解析することで行われる。 SVG fonts and their associated glyphs do not specify bounding box information. Because the glyph outlines are expressed as SVG path elements, the implementation has the option to render the glyphs either using standard graphics calls or by using special-purpose font rendering technology, in which case any necessary maximum bounding box and overhang calculations can be performed from analysis of the path elements contained within the glyph outlines.
SVG フォントは、それを利用する文書に埋め込むことも、外部リソースの一部として保存しておくこともできる。 An SVG font can be either embedded within the same document that uses the font or saved as part of an external resource.
SVG 文書に SVG フォントを埋め込む例をここに示す。 Here is an example of how you might embed an SVG font inside of an SVG document.
<?xml version="1.0"?> <svg width="400px" height="300px" version="1.2" baseProfile="tiny" xmlns = 'http://www.w3.org/2000/svg'> <defs> <font xml:id="Font1" horiz-adv-x="1000"> <font-face font-family="Super Sans" font-weight="bold" font-style="normal" units-per-em="1000" cap-height="600" x-height="400" ascent="700" descent="300" alphabetic="0" mathematical="350" ideographic="400" hanging="500"> </font-face> <missing-glyph d="M0,0h200v200h-200z"/> <!-- 感嘆符グリフの外形線 --> <glyph unicode="!" horiz-adv-x="300" d="-- Outline of exclam. pt. glyph --"/> <!-- @ グリフの外形線 --> <glyph unicode="@" d="-- Outline of @ glyph --"/> <!-- 他のグリフ --> <!-- more glyphs --> </font> </defs> <!-- 埋め込みフォントの用例。 --> <desc>An example using an embedded font.</desc> <text x="100" y="100" font-family="Super Sans, Helvetica, sans-serif" font-weight="bold" font-style="normal">Text using embedded font</text> </svg>
font 要素は SVG フォントを定義する。 The 'font' element defines an SVG font.
<define name='font'> <element name='font'> <ref name='font.AT'/> <ref name='font.CM'/> </element> </define> <define name='font.AT' combine='interleave'> <ref name='svg.Core.attr'/> <ref name='svg.External.attr'/> <ref name='svg.FontAdvOrigCommon.attr'/> <optional> <attribute name='horiz-origin-x' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> </define> <define name='font.CM'> <zeroOrMore> <choice> <ref name='svg.Desc.group'/> <ref name='font-face'/> <ref name='missing-glyph'/> <ref name='glyph'/> <ref name='hkern'/> </choice> </zeroOrMore> </define>
属性定義:
横書の際の、フォント座標系におけるグリフの原点のX座標。(原点はフォントのグリフすべてに適用されることに注意。) The X-coordinate in the font coordinate system of the origin of a glyph to be used when drawing horizontally oriented text. (Note that the origin applies to all glyphs in the font.)
省略値 は '0' 。 The lacuna value is '0'.
アニメーション:不可
横書の際の、既定のものとなるグリフの描画後の水平アドバンス。ヘブライ語やアラビア語用字系などの通常は右から左へ描画されるグリフであっても、グリフ幅は非負であることが要求される。 The default horizontal advance after rendering a glyph in horizontal orientation. Glyph widths are required to be non-negative, even if the glyph is typically rendered right-to-left, as in Hebrew and Arabic scripts.
省略値 は '0' 。 The lacuna value is '0'.
アニメーション:不可
それぞれの font 要素はフォントの種々の特徴を記述する font-face 子要素を持たなければならない。 Each 'font' element must have a 'font-face' child element which describes various characteristics of the font.
glyph 要素はグリフのグラフィックスを定義する。グリフの座標系は font 要素の種々の属性で定義される。 The 'glyph' element defines the graphics for a given glyph. The coordinate system for the glyph is defined by the various attributes in the 'font' element.
glyph を構成するグラフィックスは d 属性による単一の パスデータ からなる。 The graphics that make up the 'glyph' consist of a single path data specification within the 'd' attribute.
<define name='glyph'> <element name='glyph'> <ref name='glyph.AT'/> <ref name='glyph.CM'/> </element> </define> <define name='glyph.AT' combine='interleave'> <ref name='svg.Core.attr'/> <ref name='svg.FontAdvOrigCommon.attr'/> <ref name='svg.D.attr'/> <optional> <attribute name='unicode' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='glyph-name' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='arabic-form' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional> <attribute name='lang' svg:animatable='false' svg:inheritable='false'> <ref name='LanguageIDs.datatype'/> </attribute> </optional> </define> <define name='glyph.CM'> <zeroOrMore> <choice> <ref name='svg.Desc.group'/> </choice> </zeroOrMore> </define>
属性定義:
このグリフに対応する 文字 の連なりを指示する1個以上の文字。単独の文字が与えられた場合、その Unicode 文字がこのグリフに対応する。複数文字が与えられた場合、その Unicode 文字の連なりがこのグリフに対応する。文字の連なりの利用の1つはリガチャである。例えば unicode="ffl" ならば、文字の連なり "f", "f", "l" の描画にこのグリフが用いられる。 One or more characters indicating the sequence of characters which corresponds to this glyph. If a single character is provided, then this glyph corresponds to the given Unicode character. If multiple characters are provided, then this glyph corresponds to the given sequence of Unicode characters. One use of a sequence of characters is ligatures. For example, if unicode="ffl", then the given glyph will be used to render the sequence of characters "f", "f", and "l".
文字の参照に16進記数法もしくは十進記数法で表される XML 文字参照を利用することはしばしば有用である。例えば unicode="ffl" は、16進記数法による XML 文字参照 unicode="ffl" もしくは十進記数法による unicode="ffl" として表記できる。 It is often useful to refer to characters using XML character references expressed in hexadecimal notation or decimal notation. For example, unicode="ffl" could be expressed as XML character references in hexadecimal notation as unicode="ffl" or in decimal notation as unicode="ffl".
unicode 属性はどの文字(たち)の表現にどのグリフを用いるかの決定過程に寄与する。 グリフ選択規則 を見よ。 glyph 要素に unicode 属性が与えられていない場合、 SVG Tiny 1.2 においては、そのグリフにアクセスできない。 The 'unicode' attribute contributes to the process for deciding which glyph(s) are used to represent which character(s). See glyph selection rules. If the 'unicode' attribute is not provided for a given 'glyph', the glyph cannot be accessed in SVG Tiny 1.2.
アニメーション:不可
オプションで与えられるグリフの名前。同一フォント内のグリフ名は一意的にすべきである。グリフ名は Unicode 文字1つに対し複数のグリフが存在するときの様な、 Unicode 文字コードが正しいグリフの特定に十分な情報を持っていないときに利用できる。グリフ名は カーニング の定義から参照され得る。 An optional name for the glyph. Glyph names should be unique within a font. The glyph names can be used in situations where Unicode character numbers do not provide sufficient information to access the correct glyph, such as when there are multiple glyphs per Unicode character. The glyph names can be referenced in kerning definitions.
アニメーション:不可
path 要素の d 属性と同じ構文を用いてグリフの外形線を定義する。 パスデータ を見よ。 The definition of the outline of a glyph, using the same syntax as for the 'd' attribute on a 'path' element. See Path data.
この属性についての解説は下を見よ。 See below for a discussion of this attribute.
アニメーション:不可
アラビア語のグリフにおいて、グリフが4形式のうちのどれを表現するかを指示する。 arabic-form がそれを要するグリフに指定されていない場合、グリフは initial, medial, terminal フォームから分離され、それらのフォームは別途指定されていない限り missing-glyph を用いて描画されることになる。 For Arabic glyphs, indicates which of the four possible forms this glyph represents.If arabic-form is not specified for a glyph that requires it, the glyph is taken to be the isolated form and the initial, medial, and terminal forms will render with missing-glyph unless separately specified.
加えて、 initial, medial, terminal いずれかが arabic-form の指定を要しないグリフに指定された場合、 arabic-form 属性は効果を持たないものとする。 Additionally, if initial, medial, or terminal are specified on a glyph that does not require the arabic-form to be specified, the arabic-form attribute shall have no effect.
アニメーション:不可
IETF Best Current Practice 47 [BCP47] で定められる言語タグのコンマ区切りのリスト。 XML 内容に対しては、 xml:lang 属性がこのパラメタで与えられる言語の一つあるいはその接頭部に正確に一致するときにのみグリフが利用されることを指示する。ここで接頭部とは言語名の最初のタグ文字でその直後の文字が "-" となっているをもの指す。この属性が指定されていない場合、グリフはすべての言語で利用され得る。 The attribute value is a comma-separated list of language tags as defined in IETF Best Current Practice 47 [BCP47]. For XML content, the glyph can be used if the 'xml:lang' attribute exactly matches one of the languages given in the value of this parameter, or if the 'xml:lang' attribute exactly equals a prefix of one of the languages given in the value of this parameter such that the first tag character following the prefix is "-". If the attribute is not specified, then the glyph can be used in all languages.
例えば、グリフがフランス語( lang 属性は言語タグ 'fr')に適するなら、すべての種類のフランス語のテキスト(例えばカナダフランス語は xml:lang="fr-ca" )にも適する。 lang 属性が繁体字中国語( lang に zh-Hant が含まれる)固有のグリフは簡体字中国語( xml:lang="zh-Hanc" )または一般中国語( xml:lang="zh" )には適さない。 For example, a glyph suitable for French (whose lang attribute includes the language tag 'fr') is suitable for all types of French text (for example, Canadian French, xml:lang="fr-ca"). A glyph whose lang attribute is specific for Traditional Chinese (lang includes zh-Hant) is not suitable for Simplified Chinese (xml:lang="zh-Hanc") or generic Chinese (xml:lang="zh").
アニメーション:不可
横書の際のグリフ描画後の水平アドバンス。この属性が指定されていない場合の効果は、フォントの horiz-adv-x 属性の値が設定されたときと同じになる。 The horizontal advance after rendering the glyph in horizontal orientation. If the attribute is not specified, the effect is as if the attribute were set to the value of the font's 'horiz-adv-x' attribute.
ヘブライ語やアラビア語用字系などの通常は右から左へ描画されるようなグリフであっても、グリフ幅は非負であることが要求される。 Glyph widths are required to be non-negative, even if the glyph is typically rendered right-to-left, as in Hebrew and Arabic scripts.
アニメーション:不可
glyph のグラフィックスは d 属性で指定される。この属性内のパスデータは以下のように処理されなければならない: The graphics for the 'glyph' are specified using the 'd' attribute. The path data within this attribute must be processed as follows:
パスデータにおける相対座標は等価な絶対座標に変換される。 Any relative coordinates within the path data specification are converted into equivalent absolute coordinates.
これら絶対座標は、フォント座標系から テキスト内容要素 の現在の座標系へ変換される。この変換は、原点が 現在のテキスト位置 に揃うように, 回転はグリフ方位に揃うように, 拡縮は正しい font-size が得られるように定められる。 Each of these absolute coordinates is transformed from the font coordinate system into the text content element's current coordinate system such that the origin of the font coordinate system is properly positioned and rotated to align with the current text position and orientation for the glyph, and scaled so that the correct 'font-size' is achieved.
変換結果のパスはそれが path 要素であるかのように、かつグリフに対応する文字(たち)に適用されているスタイル付けプロパティを用いて描画される。 font 要素や glyph 要素に指定されたスタイル付けプロパティはすべて無視される。 The resulting, transformed path specification is rendered as if it were a 'path' element, using the styling properties that apply to the characters which correspond to the given glyph, and ignoring any styling properties specified on the 'font' element or the 'glyph' element.
一般に、 d 属性はシステムフォントと同じ仕方で描画される。例えばダッシュパターンは、システムフォントに適用される場合も d 属性を用いてグリフを定義する SVG フォントに適用される場合も見え方は同じになる。多くの実装において、グリフの高速な描画やより一層の性能向上をもたらすフォントキャッシュの利用が可能になる。 In general, the 'd' attribute renders in the same manner as system fonts. For example, a dashed pattern will usually look the same if applied to a system font or to an SVG font which defines its glyphs using the 'd' attribute. Many implementations will be able to render glyphs quickly and will be able to use a font cache for further performance gains.
下の Example font01 は S, V, G の3文字、および他のすべての文字に対しては missing glyph のみからなるフォントを含む。 V と G のグリフを字詰するカーニングのペアもある。このフォント Anglepoise は Larabie Fonts の Ray Larabie 氏によるデザインで許諾はとってある。 Example font01 below contains a font for just three letters - S, V, and G - plus a missing glyph for all other characters. There is also a kern pair, to bring the V and the G glyphs closer together. The font, Anglepoise, was designed by Ray Larabie of Larabie Fonts and is used by permission.
<?xml version="1.0" encoding="UTF-8"?> <svg version="1.2" baseProfile="tiny" viewBox="0 0 160 70" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>Font example</title> <defs> <font horiz-adv-x="313" xml:id="la"> <metadata>Converted from Larabie Anglepoise by Batik ttf2svg See http://www.larabiefonts.com/ </metadata> <font-face font-family="larabie-anglepoise" units-per-em="1000" panose-1="0 0 4 0 0 0 0 0 0 0" ascent="703" descent="-300" alphabetic="0"/> <missing-glyph horiz-adv-x="500" d="M63 0V700H438V0H63ZM125 63H375V638H125V63Z"/> <glyph unicode="S" glyph-name="S" horiz-adv-x="385" d="M371 1H29V144H264Q264 151 264 166Q265 180 265 188Q265 212 249 212H132Q83 212 55 247Q29 279 29 329V566H335V422H136V375Q136 360 144 356Q148 355 168 355H279Q327 355 352 309Q371 273 371 221V1Z"/> <glyph unicode="V" glyph-name="V" horiz-adv-x="351" d="M365 563L183 -33L0 563H101L183 296L270 563H365Z"/> <glyph unicode="G" glyph-name="G" horiz-adv-x="367" d="M355 1H18V564H355V420H125V144H248V211H156V355H355V1Z"/> <hkern g1="V" g2="G" k="-40"/> </font> </defs> <text x="40" y="50" font-family="larabie-anglepoise" font-size="70" fill="#933">SVG</text> <rect x="00" y="00" width="160" height="70" stroke="#777" fill="none"/> </svg>
下の Example font02 は1個のアラビア語文字 خ に加え、スペースと missing glyph だけからなるフォントを含む。この文字には4個のグリフがあり、それぞれ、同じ Unicode 符号位置 U+062E に対応する。これらは arabic-form 属性の値で区別される。テキスト文字列は4個それぞれのフォームを表示する。 Example font02 below contains a font for a single character, the Arabic letter خ - plus a space and missing glyph. There are four glyphs for this character, each corresponding to the same Unicode code point U+062E. They are distinguished by the values of the arabic-form attribute. The text string demonstrates each of the four forms.
<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.2" baseProfile="tiny" viewBox="80 100 260 180" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<title>Font example for arabic-form</title>
<defs>
<font horiz-adv-x="573">
<font-face font-family="SVGAr" units-per-em="1000" panose-1="5 1 1 1 1 1 1 1 1 1"
ascent="1025" descent="-399" alphabetic="0"/>
<missing-glyph horiz-adv-x="500" d="M31 0V800H469V0H31ZM438 31V769H62V31H438Z"/>
<glyph unicode=" " glyph-name="space" horiz-adv-x="370"/>
<glyph unicode="خ" glyph-name="khah-isolated" arabic-form="isolated"
horiz-adv-x="562" d="M309 360Q309 353 297 335T271 317Q260 317 227 337T194 370Q194
380 205 397T232 415Q246 415 277 395T309 360ZM518 -265Q516 -269 509 -275Q507 -277 502
-281Q447 -319 424 -330Q356 -363 281 -363Q228 -363 186 -347T110 -294Q69 -249 54
-199Q44 -167 44 -127Q44 -96 50 -65T76 12Q88 39 110 70Q152 127 152 137Q152 151 148
156T121 161Q95 161 85 156Q72 146 62 140Q44 128 35 130Q35 138 35 146Q37 151 43 162Q77
208 98 219T159 231Q170 231 234 221Q255 218 298 210H340Q347 210 382 218T425 230T435
235Q446 239 449 234Q454 226 444 189T426 152Q418 152 393 154T360 156Q327 156 297
149T228 120Q180 93 142 36Q96 -33 96 -110Q96 -209 168 -257Q223 -294 300 -294Q343 -294
371 -291Q429 -285 489 -267Q506 -260 511 -260Q514 -262 518 -265Z"/>
<glyph unicode="خ" glyph-name="khah-initial" arabic-form="initial"
horiz-adv-x="728" d="M297 372Q297 365 285 347T259 329Q248 329 215 349T182 382Q182
392 193 409T220 427Q234 427 265 407T297 372ZM600 0H0V68H373Q396 68 396 86Q396 89 394
95Q377 137 347 159Q308 188 243 188Q210 188 183 171Q165 160 157 158T145 156Q138 156
138 164L140 174Q145 196 191 220Q228 240 269 240Q313 240 355 221T447 160Q488 120 530
81Q543 73 563 71T609 68Q619 68 620 68T625 68Q645 68 645 46Q645 30 633 15T600 0Z"/>
<glyph unicode="خ" glyph-name="khah-medial" arabic-form="medial"
horiz-adv-x="625" d="M296 376Q296 369 284 351T258 333Q247 333 214 353T181 386Q181
396 192 413T219 431Q233 431 264 411T296 376ZM625 0H0V68H373Q396 68 396 86Q396 89 394
95Q377 137 347 159Q308 188 243 188Q210 188 183 171Q165 160 157 158T145 156Q138 156
138 164L140 174Q145 196 191 220Q228 240 269 240Q313 240 355 221T447 160Q488 120 530
81Q543 73 563 71T609 68Q619 68 620 68T625 68V0Z"/>
<glyph unicode="خ" glyph-name="khah-terminal" arabic-form="terminal"
horiz-adv-x="514" d="M296 352Q296 345 284 327T258 309Q247 309 214 329T181 362Q181
372 192 389T219 407Q233 407 264 387T296 352ZM514 0H375Q313 0 298 64T261 128Q209 128
153 62Q91 -12 91 -101Q91 -199 162 -243Q220 -279 319 -279Q367 -279 390 -276T463
-259Q466 -258 475 -255T488 -252Q490 -252 491 -254T489 -263Q484 -272 466 -286T433
-307Q408 -320 401 -323Q349 -344 277 -344Q169 -344 104 -274Q44 -210 44 -118Q44 -88 51
-53T73 14Q80 31 97 56Q132 108 132 118Q132 127 126 134T110 141Q92 141 85 137Q72 127
59 117Q49 112 44 112Q38 112 38 119Q38 122 40 128Q49 156 80 182Q116 212 157 212Q170
212 188 208Q232 198 258 198H320Q345 198 357 201Q374 207 383 209T398 214T412 216Q420
216 421 212Q424 202 414 170T396 137Q394 137 382 140T362 143Q346 143 337 135T327
104Q327 91 341 80T379 68H514V0Z"/>
</font>
</defs>
<g font-family="SVGAr" font-size="80">
<!-- これは単独形 khah に続き、頭字, 中字, 尾字 khah を順に生成すべきである。 -->
<!-- this should produce isolated khah, followed by initial,medial and terminal khah -->
<text x="100" y="200">خ خخخ</text>
<rect x="80" y="100" width="260" height="180" fill="none" stroke="#777"/>
</g>
</svg>
missing-glyph 要素は、与えられたフォントのグリフの描画を試みる際に、そのグリフが定義されていなかった場合に利用するグラフィックを定義する。 missing-glyph 要素の属性は glyph 要素の対応する属性と同じ意味を持つ。 The 'missing-glyph' element defines a graphic to use if there is an attempt to draw a glyph from a given font and the given glyph has not been defined. The attributes on the 'missing-glyph' element have the same meaning as the corresponding attributes on the 'glyph' element.
<define name='missing-glyph'> <element name='missing-glyph'> <ref name='missing-glyph.AT'/> <ref name='missing-glyph.CM'/> </element> </define> <define name='missing-glyph.AT' combine='interleave'> <ref name='svg.Core.attr'/> <ref name='svg.FontAdvOrigCommon.attr'/> <ref name='svg.D.attr'/> </define> <define name='missing-glyph.CM'> <zeroOrMore> <choice> <ref name='svg.Desc.group'/> </choice> </zeroOrMore> </define>
一連の文字を描くグリフを決定するにあたっては、 font 要素内の glyph 要素が検索されなければならない。検索は最初の glyph から最後のものへと論理順序で、 unicode 属性に指定された Unicode 文字の連なりが描画される当該 Unicode 文字の連なりに一致するまで行われ、最初に一致したものが用いられなければならない。従って、フォントの中でリガチャ "ffl" がグリフ "f" の後に定義されている場合、利用されない。 When determining the glyph(s) to draw a given character sequence, the 'font' element must be searched from its first 'glyph' element to its last in logical order to see if the upcoming sequence of Unicode characters to be rendered matches the sequence of Unicode characters specified in the 'unicode' attribute for the given 'glyph' element. The first successful match must be used. Thus, if an "ffl" ligature is defined in the font after the "f" glyph, it will not be used.
hkern 要素は、横書においてカーニングされるグリフ対を定義する。 The 'hkern' element defines kerning pairs for horizontally-oriented pairs of glyphs.
カーニング対は、同じフォントの2つのグリフが続けて描画されるときにその間隔が調整されるようなグリフの対を指定する。 SVG フォントのカーニングが生じるためには、グリフ対が同じフォントに属する必要があるのに加え、2つのグリフに対応する文字たちのプロパティ: font-family, font-size, font-style, font-weight がすべて同じ値になる必要がある。 Kern pairs identify pairs of glyphs within a single font whose inter-glyph spacing is adjusted when the pair of glyphs are rendered next to each other. In addition to the requirement that the pair of glyphs are from the same font, SVG font kerning happens only when the two glyphs correspond to characters which have the same values for properties 'font-family', 'font-size', 'font-style' and 'font-weight'.
カーニング対の例は英字 "Va" である。この場合、英字 "V" と "a" を少しだけ近付けて描画すると、見栄えが良くなるであろう。 An example of a kerning pair are the letters "Va", where the typographic result might look better if the letters "V" and the "a" were rendered slightly closer together.
右から左の、および双方向のテキストは、 双方向性との関係 で述べられている様に2段階の処理を経て配置される。 SVG フォントが利用される場合、カーニングが適用される前に文字たちは視覚的描画順序において左から右へ(縦書の場合は上から下へ)再配列される。 SVG フォントによるカーニングは続けて描画されるグリフの対に適用される。カーニング対の第一グリフは視覚的描画順序において左(または上)側であり、第二グリフは右(または下)側である。 Right-to-left and bidirectional text in SVG is laid out in a two-step process, which is described in Relationship with bidirectionality. If SVG fonts are used, before kerning is applied, characters are re-ordered into left-to-right (or top-to-bottom, for vertical text) visual rendering order. Kerning from SVG fonts is then applied on pairs of glyphs which are rendered contiguously. The first glyph in the kerning pair is the left (or top) glyph in visual rendering order. The second glyph in the kerning pair is the right (or bottom) glyph in the pair.
フォントデザイナーへの便宜とファイルサイズ節減のため、1個の hkern にグリフの集合( Unicode 文字のシークエンスや範囲)と別の集合(例えば別の範囲の Unicode 文字)との間に同じカーニング調整値をまとめて適用させることもできる。 For convenience to font designers and to minimize file sizes, a single 'hkern' can define a single kerning adjustment value between one set of glyphs (sequences and/or ranges of Unicode characters) and another set of glyphs (e.g., another range of Unicode characters).
hkern 要素は2つのグリフが連続して水平に(すなわち横並びに)描画されるときのカーニング対と水平アドバンスの調整値を定義する。文字の間隔はカーニング調整により詰められる(負のカーニング調整値は文字の間隔を拡げる)。 The 'hkern' element defines kerning pairs and adjustment values in the horizontal advance value when drawing pairs of glyphs which the two glyphs are contiguous and are both rendered horizontally (i.e., side-by-side). The spacing between characters is reduced by the kerning adjustment. (Negative kerning adjustments increase the spacing between characters.)
<define name='hkern'> <element name='hkern'> <ref name='hkern.AT'/> <ref name='hkern.CM'/> </element> </define> <define name='hkern.AT' combine='interleave'> <ref name='svg.Core.attr'/> <optional> <attribute name='u1' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional> <attribute name='g1' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional> <attribute name='u2' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional> <attribute name='g2' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional> <attribute name='k' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> </define> <define name='hkern.CM'> <zeroOrMore> <choice> <ref name='svg.Desc.group'/> </choice> </zeroOrMore> </define>
属性定義:
カーニング対における第一グリフになり得るグリフの集合を定める 文字 や Unicode 文字の範囲の(コンマ区切りの)連なり( Unicode 文字の範囲についての説明は CSS2 [CSS2] を参照のこと 【 CSS 2.0 の 15.3.3 節 】)。1つの Unicode 文字に対応する複数の glyph 要素がある場合(すなわち複数の glyph 要素が同じ unicode 属性値を持つが、異なる glyph-name 属性値を持つ)、それらのグリフはすべて集合に含まれる。区切り文字コンマのカーニングを行う場合は Unicode 文字の範囲として、あるいは g1 属性によるグリフ名として指定する。カーニング対の第一グリフとなれるもののの全集合は u1 および g1 属性で指定されるグリフの和集合になる。 A sequence (comma-separated) of characters and/or ranges of Unicode characters (see description of ranges of Unicode characters in [CSS2]) which identify a set of possible first glyphs in the kerning pair. If a given Unicode character within the set has multiple corresponding 'glyph' elements (i.e., there are multiple 'glyph' elements with the same 'unicode' attribute value, but different 'glyph-name' values), then all such glyphs are included in the set. Comma is the separator character; thus, to kern a comma, specify the comma as part of a range of Unicode characters or as a glyph name using the 'g1' attribute. The total set of possible first glyphs in the kerning pair is the union of glyphs specified by the 'u1' and 'g1' attributes.
アニメーション:不可
カーニング対の第一グリフになり得るグリフの集合を定めるグリフ名の連なり(すなわち glyph 要素の glyph-name 属性に一致する値のリスト)。与えられた名前を持つグリフすべては集合に含まれる。カーニング対の第一グリフとなり得るものの全集合は u1 および g1 属性で指定されるグリフの和集合になる。 A sequence of glyph names (i.e., values that match 'glyph-name' attributes on 'glyph' elements) which identify a set of possible first glyphs in the kerning pair. All glyphs with the given glyph name are included in the set. The total set of possible first glyphs in the kerning pair is the union of glyphs specified by the 'u1' and 'g1' attributes.
アニメーション:不可
カーニング対の第2グリフになり得るグリフを指定することを除いて u1 属性と同じ。 Same as the 'u1' attribute, except that 'u2' specifies possible second glyphs in the kerning pair.
アニメーション:不可
カーニング対の第2グリフになり得るグリフを指定することを除いて g1 属性と同じ。 Same as the 'g1' attribute, except that 'g2' specifies possible second glyphs in the kerning pair.
アニメーション:不可
カーニング対の2つのグリフの間隔調整における減少量をフォント座標系で指定する。値はフォント座標系。 省略値 は '0' 。 The amount to decrease the spacing between the two glyphs in the kerning pair. The value is in the font coordinate system. The lacuna value is '0'.
アニメーション:不可
少なくとも u1 と g1 のいずれかと、少なくとも u2 と g2 のいずれかは与えられなければならない。 At least one of 'u1' and 'g1' must be provided, and at least one of 'u2' and 'g2' must be provided.
フォント記述子(font description)は、文書作成者のフォント指定とフォントデータとの橋渡しを提供する。フォントデータとは、テキスト整形と文字に対応する抽象的グリフの描画に必要なデータ - 実際のスケーラブルな外形線あるいはビットマップ - である。フォントは font-family プロパティなどのプロパティにより参照される。 A font description provides the bridge between an author's font specification and the font data, which is the data needed to format text and to render the abstract glyphs to which the characters map — the actual scalable outlines or bitmaps. Fonts are referenced by properties, such as the 'font-family' property.
指定された各フォント記述子は、適切なフォントデータの選択を可能にするためにフォントデータベースに追加される。フォント記述子はフォントデータのウェブ上のロケーションやフォントデータの特徴を表す記述子を持つ。フォント記述子はフォントプロパティを特定のフォントデータに結び付けるためにも必要になる。各フォント記述子の詳細度は単なるフォント名からグリフ幅のリストまで様々である。 Each specified font description is added to the font database so that it can be used to select the relevant font data. The font description contains descriptors such as the location of the font data on the Web, and characterizations of that font data. The font descriptors are also needed to match the font properties to particular font data. The level of detail of a font description can vary from just the name of the font up to a list of glyph widths.
フォント記述子についての更なる詳細は CSS2 仕様の フォント の章 [CSS2] を参照のこと。 For more about font descriptions, refer to the Fonts chapter in the CSS2 specification [CSS2].
font-face 要素は CSS2 の @font-face の機能に直接対応する XML 構造である。任意のフォント, SVG フォント, その他の特徴の記述に利用できる。 The 'font-face' element is an XML structure which corresponds directly to the @font-face facility in CSS2. It can be used to describe the characteristics of any font, SVG font or otherwise.
同じ文書に含まれる SVG フォントの特徴の記述子に利用する場合、 font 要素が外部依存性の無い独立なものとなるように font-face 要素を当該 font 要素の子とすることが推奨される。この場合、 font-face 要素内の font-face-src 要素は無視され、 font-face 要素はその親の font 要素の特徴を記述するものとみなされる。 When used to describe the characteristics of an SVG font contained within the same document, it is recommended that the 'font-face' element be a child of the 'font' element it is describing so that the 'font' element can be self-contained and fully-described. In this case, any 'font-face-src' elements within the 'font-face' element are ignored as it is assumed that the 'font-face' element is describing the characteristics of its parent 'font' element.
<define name='font-face'> <element name='font-face'> <ref name='font-face.AT'/> <ref name='font-face.CM'/> </element> </define> <define name='font-face.AT' combine='interleave'> <ref name='svg.Core.attr'/> <ref name='svg.External.attr'/> <optional><attribute name='font-family' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='font-style' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='font-weight' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='font-variant' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='font-stretch' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='unicode-range' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='panose-1' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='widths' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional><attribute name='bbox' svg:animatable='false' svg:inheritable='false'><text/></attribute> </optional> <optional> <attribute name='units-per-em' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='stemv' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='stemh' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='slope' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='cap-height' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='x-height' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='accent-height' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='ascent' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='descent' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='ideographic' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='alphabetic' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='mathematical' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='hanging' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='underline-position' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='underline-thickness' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='strikethrough-position' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='strikethrough-thickness' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='overline-position' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> <optional> <attribute name='overline-thickness' svg:animatable='false' svg:inheritable='false'> <ref name='Number.datatype'/> </attribute> </optional> </define> <define name='font-face.CM'> <zeroOrMore> <choice> <ref name='svg.Desc.group'/> <ref name='font-face-src'/> </choice> </zeroOrMore> </define>
属性定義:
@font-face 規則の font-family 記述子と同じ構文と意味内容を持つ。 Same syntax and semantics as the 'font-family' descriptor within an @font-face rule.
アニメーション:不可
@font-face 規則の font-style 記述子と同じ構文と意味内容を持つ。フォントのスタイル。コンマ区切りのリストも許されること以外は、 'font-style' プロパティと同じ値をとれる。 Same syntax and semantics as the 'font-style' descriptor within an @font-face rule. The style of a font. Takes on the same values as the 'font-style' property, except that a comma-separated list is permitted.
省略値 は 'all' 。 The lacuna value is 'all'.
アニメーション:不可
@font-face 規則の font-weight 記述子と同じ構文と意味内容を持つ。 Same syntax and semantics as the 'font-weight' descriptor within an @font-face rule.
同じフォントファミリの他のものに相対的な書体のウェイト(weight)。次の3つの例外を除いて 'font-weight' プロパティと同じ値をとれる: The weight of a face relative to others in the same font family. Takes on the same values as the 'font-weight' property with three exceptions:
省略値 は 'all' 。 The lacuna value is 'all'.
アニメーション:不可
@font-face 規則の unicode-range 記述子と同じ構文と意味内容を持つ。フォントのグリフが受け持ち得る ISO 10646 文字 [UNICODE] の範囲。この仕様で与えられる追加情報を除き、この属性の正式な定義は [CSS2] で与えられる。 Same syntax and semantics as the 'unicode-range' descriptor within an @font-face rule. The range of ISO 10646 characters [UNICODE] possibly covered by the glyphs in the font. Except for any additional information provided in this specification, the normative definition of the attribute is in [CSS2].
省略値 は 'U+0-10FFFF' 。 The lacuna value is 'U+0-10FFFF'.
アニメーション:不可
@font-face 規則の units-per-em 記述子と同じ構文と意味内容を持つ。グリフのデザイン格子の大きさとなる、エム平方の一辺の長さが何単位になるかを表した数。 Same syntax and semantics as the 'units-per-em' descriptor within an @font-face rule. The number of coordinate units on the em square, the size of the design grid on which glyphs are laid out.
他の属性のほとんどがデザイン格子の定義を要するので、この値はほぼ常に指定すべきである。 This value should be specified as nearly every other attribute requires the definition of a design grid.
省略値 は '1000' 。 The lacuna value is '1000'.
アニメーション:不可
@font-face 規則の panose-1 記述子と同じ構文と意味内容を持つ。空白で区切られた 10 個の十進整数で構成される Panose-1 数。この仕様で与えられる追加情報を除き、この属性の正式な定義は [CSS2] で与えられる。 Same syntax and semantics as the 'panose-1' descriptor within an @font-face rule. The Panose-1 number, consisting of ten decimal integers, separated by white space. Except for any additional information provided in this specification, the normative definition of the attribute is in [CSS2].
省略値 は '0 0 0 0 0 0 0 0 0 0' 。 The lacuna value is '0 0 0 0 0 0 0 0 0 0'.
アニメーション:不可
@font-face 規則の stemv 記述子と同じ構文と意味内容を持つ。 Same syntax and semantics as the 'stemv' descriptor within an @font-face rule.
アニメーション:不可
@font-face 規則の stemh 記述子と同じ構文と意味内容を持つ。 Same syntax and semantics as the 'stemh' descriptor within an @font-face rule.
アニメーション:不可
@font-face 規則の slope 記述子と同じ構文と意味内容を持つ。フォントの垂直ストローク角度。この仕様で与えられる追加情報を除き、この属性の正式な定義は [CSS2] で与えられる。 Same syntax and semantics as the 'slope' descriptor within an @font-face rule. The vertical stroke angle of the font. Except for any additional information provided in this specification, the normative definition of the attribute is in [CSS2].
省略値 は '0' 。 The lacuna value is '0'.
アニメーション:不可
@font-face 規則の cap-height 記述子と同じ構文と意味内容を持つ。 フォントの大文字グリフのフォント座標系における高さ。 Same syntax and semantics as the 'cap-height' descriptor within an @font-face rule. The height of uppercase glyphs in the font within the font coordinate system.
アニメーション:不可
@font-face 規則の x-height 記述子と同じ構文と意味内容を持つ。フォントの小文字グリフのフォント座標系における高さ。 Same syntax and semantics as the 'x-height' descriptor within an @font-face rule. The height of lowercase glyphs in the font within the font coordinate system.
アニメーション:不可
フォント座標系における原点からアクセント付き文字の上端までの距離。 The distance from the origin to the top of accent characters, measured by a distance within the font coordinate system.
この属性が指定されていない場合の効果は、 ascent 属性の値が設定されたときと同じになる。 この属性が用いられる場合は、 units-per-em 属性が指定されなければならない。 If the attribute is not specified, the effect is as if the attribute were set to the value of the 'ascent' attribute. If this attribute is used, the 'units-per-em' attribute must also be specified.
アニメーション:不可
@font-face 規則の ascent 記述子と同じ構文と意味内容を持つ。フォント座標系における原点からアクセントなしの文字の上端までの最大距離。 Same syntax and semantics as the 'ascent' descriptor within an @font-face rule. The maximum unaccented height of the font within the font coordinate system.
この属性が指定されていない場合の効果は、対応するフォントの units-per-em の値と vert-origin-y の値との差が値に設定されたときと同じになる。 If the attribute is not specified, the effect is as if the attribute were set to the difference between the 'units-per-em' value and the 'vert-origin-y' value for the corresponding font.
アニメーション:不可
@font-face 規則の descent 記述子と同じ構文と意味内容を持つ。フォント座標系における原点からアクセントなしの文字の下端まで(unaccented depth)の最大距離。 Same syntax and semantics as the 'descent' descriptor within an @font-face rule. The maximum unaccented depth of the font within the font coordinate system.
この属性が指定されていない場合の効果は、対応するフォントの vert-origin-y の値が設定されたときと同じになる。 If the attribute is not specified, the effect is as if the attribute were set to the 'vert-origin-y' value for the corresponding font.
アニメーション:不可
@font-face 規則の widths 記述子と同じ構文と意味内容を持つ。 Same syntax and semantics as the 'widths' descriptor within an @font-face rule.
アニメーション:不可
@font-face 規則の bbox 記述子と同じ構文と意味内容を持つ。 Same syntax and semantics as the 'bbox' descriptor within an @font-face rule.
アニメーション:不可
横書グリフ配置における、表意文字基底線による整列を得るためのグリフの整列座標を指示する。値はフォント座標系におけるオフセット。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 For horizontally oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve ideographic baseline alignment. The value is an offset in the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
@font-face 規則の baseline 記述子と同じ構文と意味内容を持つ。横書グリフ配置における、アルファベット基底線による整列を得るためのグリフの整列座標を指示する。値はフォント座標系におけるオフセット。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 Same syntax and semantics as the 'baseline' descriptor within an @font-face rule. For horizontally oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve alphabetic baseline alignment. The value is an offset in the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
@font-face 規則の mathline 記述子と同じ構文と意味内容を持つ。 横書グリフ配置における、数式基底線による整列を得るためのグリフの整列座標を指示する。値はフォント座標系におけるオフセット。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 Same syntax and semantics as the 'mathline' descriptor within an @font-face rule. For horizontally oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve mathematical baseline alignment. The value is an offset in the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
横書グリフ配置における、吊り下げ基底線による整列を得るためのグリフの整列座標を指示する。値はフォント座標系におけるオフセット。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 For horizontally oriented glyph layouts, indicates the alignment coordinate for glyphs to achieve hanging baseline alignment. The value is an offset in the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
フォント座標系における下線の望ましい位置。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 The ideal position of an underline within the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
フォント座標系における長さで表される下線の望ましい太さ。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 The ideal thickness of an underline, expressed as a length within the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
フォント座標系における削除線(strike-through)の望ましい位置。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 The ideal position of a strike-through within the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
フォント座標系における長さで表される削除線の望ましい太さ。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 The ideal thickness of a strike-through, expressed as a length within the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
フォント座標系における上線(overline)の望ましい位置。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 The ideal position of an overline within the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
フォント座標系における長さで表される上線の望ましい太さ。この属性が与えられる場合は units-per-em 属性も指定されなければならない。 The ideal thickness of an overline, expressed as a length within the font coordinate system. If this attribute is provided, the 'units-per-em' attribute must also be specified.
アニメーション:不可
font-face-src 要素は、以下で詳しく述べる font-face-uri 属性を伴なって、 @font-face 規則の src 記述子に対応するものになる。( CSS 2 仕様 ([CSS2], sections 15.3.1 and 15.3.5) の @font-face 規則の 'src' 記述子を参照のこと)。 The 'font-face-src' element, together with the 'font-face-uri' elements described further down correspond to the 'src' descriptor within an @font-face rule. (Refer to the descriptions of the @font-face rule and 'src' descriptor in the CSS 2 specification ([CSS2], sections 15.3.1 and 15.3.5).
font-face-src 要素は font-face-uri 要素を含む。 font-face-src 要素は他の場所で定義されたフォントを参照するために利用される。 A 'font-face-src' element contains a 'font-face-uri' element. The 'font-face-src' element is used for referencing fonts defined elsewhere.
<define name='font-face-src'> <element name='font-face-src'> <ref name='font-face-src.AT'/> <ref name='font-face-src.CM'/> </element> </define> <define name='font-face-src.AT' combine='interleave'> <ref name='svg.Core.attr'/> </define> <define name='font-face-src.CM'> <zeroOrMore> <choice> <ref name='svg.Desc.group'/> <ref name='font-face-uri'/> </choice> </zeroOrMore> </define>
font-face-uri 要素は font-face-src 要素内で現在の SVG 文書の内部または外部で定義されたフォントを参照するために利用される。 The 'font-face-uri' element is used within a 'font-face-src' element to reference a font defined inside or outside of the current SVG document.
font-face-uri が SVG フォントを参照している場合、参照先は SVG font 要素でなければならず、従って素片識別子が必要になる( [IRI] を見よ)。参照先の font 要素はローカル(すなわち font-face-uri 要素と同じ文書内)またはリモート(すなわち異なる文書)のいずれにあってもよい。 When a 'font-face-uri' is referencing an SVG font, then that reference must be to an SVG 'font' element, therefore requiring the use of a fragment identifier (see [IRI]). The referenced 'font' element can be local (i.e., within the same document as the 'font-face-uri' element) or remote (i.e., within a different document).
<define name='font-face-uri'> <element name='font-face-uri'> <ref name='font-face-uri.AT'/> <ref name='font-face-uri.CM'/> </element> </define> <define name='font-face-uri.AT' combine='interleave'> <ref name='svg.Core.attr'/> <ref name='svg.XLinkRequired.attr'/> <ref name='svg.External.attr'/> </define> <define name='font-face-uri.CM'> <zeroOrMore> <choice> <ref name='svg.Desc.group'/> </choice> </zeroOrMore> </define>
下の Example font03 は Example font01.svg で定義された外部の SVG フォントを参照する。 Example font03 references an external SVG font, which was defined in example font01.svg.
<?xml version="1.0" encoding="UTF-8"?> <svg version="1.2" baseProfile="tiny" viewBox="0 0 110 70" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>Font example</title> <defs> <font-face font-family="larabie-anglepoise"> <font-face-src> <font-face-uri xlink:href="font01.svg#la"/> </font-face-src> </font-face> </defs> <rect x="00" y="00" width="110" height="70" stroke="#777" fill="none"/> <text x="10" y="50" font-family="larabie-anglepoise" font-size="70" fill="#FDD" stroke="#533" stroke-width="1.6">SVG</text> </svg>