text.html

 
<p class="zw">当我们构造一个名字时，会把名字分成多个部分，第一个是名字Nick，第二个是他的姓氏Jefferies。</p> 
<pre class="代码无行号"><code><span class="p-given-name">Nick</span> 
<span class="p-family-name">Jefferies</span></code></pre> 
<p class="zw">如果Nick Jefferies的名片上有一个尊称的前缀（先生、女士、长官、教授等），甚至是他的绰号（Sawbuck），我们也可以包括进来。</p> 
<pre class="代码无行号"><code><span class="p-honorific-prefix">Mr.</span> 
<span class="p-Nickname">Sawbuck</span></code></pre> 
<p class="zw">Mr Nick （Sawbuck）Jefferies的结构化名称里的所有单独的组件，现在看起来应该是这样的。</p> 
<pre class="代码无行号"><code><span class="p-honorific-prefix">Mr.</span> 
<span class="p-given-name">Nick</span> 
<span class="p-Nickname">Sawbuck</span> 
<span class="p-family-name">Jefferies</span></code></pre> 
<p class="zw">然后我们所要做的就是把Nick的结构化名字放在一个最合适的HTML根元素里。一般情况下是列表、段落、<code>section</code>、<code>article</code>或者<code>footer</code>。哪个更合适，就把<code>h-card</code>赋值到它的<code>class</code>上就好了。</p> 
<pre class="代码无行号"><code><div class="h-card"> 
   <span class="p-honorific-prefix">Mr.</span> 
   <span class="p-given-name">Nick</span> 
   <span class="p-Nickname">Sawbuck</span> 
   <span class="p-family-name">Jefferies</span> 
</div></code></pre>