files/zh-cn/web/svg/attribute/font-family/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

---
title: font-family
slug: Web/SVG/Attribute/font-family
tags:
  - SVG属性
translation_of: Web/SVG/Attribute/font-family
---
<p>« <a href="/en/SVG/Attribute" title="en/SVG/Attribute">SVG Attribute reference home</a></p>
<p><code>font-family</code> 属性(attribute) 指出哪个字体集将被用来渲染文字， 在带优先级的字体集名称列表被指定，还有或没有泛指的字符集名称。(specified as a prioritized list of font family names and/or generic family names)。</p>
<p>作为一个表现层的属性，<code>font-family</code>属性也可以被直接用在CSS样式表中，详见 {{ cssxref("font-family","CSS font-family") }} 。</p>
<h2 id="使用上下文">使用上下文</h2>
<table class="standard-table">
 <tbody>
  <tr>
   <th scope="row">分类</th>
   <td>Presentation attribute</td>
  </tr>
  <tr>
   <th scope="row">值</th>
   <td>[[&lt;family-name&gt; | &lt;generic-family&gt;],]* [&lt;family-name&gt; | &lt;generic-family&gt;] | inherit</td>
  </tr>
  <tr>
   <th scope="row">可动画Animatable</th>
   <td>Yes</td>
  </tr>
  <tr>
   <th scope="row">规范文档</th>
   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#FontFamilyProperty" title="http://www.w3.org/TR/SVG11/text.html#FontFamilyProperty">SVG 1.1 (2nd Edition)</a></td>
  </tr>
 </tbody>
</table>
<h2 id="例子">例子</h2>
<h4 id="css">css</h4>
<pre>p.class1{font-family:"Times New Roman",Times,serif;}
p.class2{font-family:Arial,Helvetica;}
</pre>
<h4 id="html">html</h4>
<pre class="brush: html">&lt;p class="class1"&gt;This is a paragraph, shown in the Times New Roman font.&lt;/p&gt;
&lt;p class="class2"&gt;This is a paragraph, shown in the Arial font.&lt;/p&gt;
</pre>
<h2 id="元素">元素</h2>
<p>以下元素可以使用<code>font-family</code> 属性(attribute)</p>
<ul>
 <li><a href="/en/SVG/Element#Text_content_elements" title="en/SVG/Element#Text_content_elements">Text content elements</a> »</li>
</ul>
<h2 id="另见">另见</h2>
<ul>
 <li>{{ cssxref("font-family","CSS font-family") }}</li>
</ul>