breadcrumbs - 隐藏的面包屑丰富代码段

Question

我想为我的网站实现面包屑，但我不想在我的页面上为它创建任何可见的标签。我想过使用元标记，但由于它们没有 href 属性，因此它们不能包含 itemprop="url" 属性。以下是我使用的代码:

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <meta href="http://www.example.com/dresses" itemprop="url">
    <meta itemprop="title" content="Dresses">

</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <meta href="http://www.example.com/dresses/real" itemprop="url">
    <meta itemprop="title" content="Real Dresses">
</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <meta href="http://www.example.com/clothes/dresses/real/green" itemprop="url">
    <meta itemprop="title" content="Real Green Dresses">
</div>

是否有任何变通方法可以实现此目的？

Answer 1

HTML5 定义 meta element

[…] represents various kinds of metadata that cannot be expressed using the title, base, link, style, and script elements.

link element “允许作者将他们的文档链接到其他资源”。

因此，如果值是 URI，则必须使用 link 而不是 meta。 (也是 Microdata explicitly requires this。)

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <link itemprop="url" href="http://www.example.com/dresses">
  <meta itemprop="title" content="Dresses">
</div>