Question

我的两个div（article-tag-summary和article-date-summary）属于article-image-summary div。这很好，不能改变。

所有内容都属于schema.org/Article，因此也属于<div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">。

的问题：

1 - 如果我关闭<div class="article-image-summary" itemprop="image">，则两个div落在图像之外这对我的CSS造型很不利。
2 - 如果我不关闭它，那么 itemprop="articleSection和itemprop="datePublished不是在schema.org中被识别，因为它们与ImageObject和。{ 不schema.org/Article也不好。

这是一个纯粹的HTML问题......我需要的是让date-summary和tag-summary置于image-summary之下（所以不要在它们之前关闭div），这两个div具有与schema.org/Article相关的迭代，而不与ImageObject相关。

下面的示例显示了date和tag之前的两个结束div，这意味着schema.org验证工作正常。但在这种情况下，我对这两个元素的CSS样式不起作用，因为它们不属于image-summary div。

＆＃13;

<div itemscope itemtype="http://schema.org/Article">
        <div itemprop="image" itemscope itemtype=
        "http://schema.org/ImageObject">
            <div class="article-image-summary" itemprop="image">
                <meta content="auto">
                <meta content="100"><a href="#"><img alt=
                "#" itemprop="url" src=
                "#"></a>
            </div>
        </div>
        <div class="article-tag-summary" itemprop="articleSection">
            <a href="#>tag</a>
        </div><!--<div class="article-data">-->
        <div class="article-date-summary" itemprop="datePublished">
            date
            <div class="page-views">
                <i class="fa fa-eye"></i> count
            </div>
        </div><!--</div>-->
        <h2 class="title-article-masonry" itemprop="headline"></h2>
    </div>

＆＃13;

Answer 1

您可以使用Microdata的itemref属性解决此问题。

为了实现这一点，您必须将article-tag-summary和article-date-summary（以及可能的其他属性）移到schema:Article元素之外。

为每个媒体资源id，并在id属性中引用这些itemref值（＆＃34; foo1＆＃34;＆＃34; foo2＆＃34;在我的示例）：

<div itemscope itemtype="http://schema.org/Article" itemref="foo1 foo2">

  <div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
  </div>

</div>

<div id="foo1" class="article-tag-summary" itemprop="articleSection">
</div>

<div id="foo2" class="article-date-summary" itemprop="datePublished">
</div>

如果您需要为所有这些部分进行分组div，您当然可以添加它。当您使用Schema.org的Article类型时，article元素很可能比div更合适。

微数据和div

1 个答案: