33

「画像」が div である<div>というbackground-image理由background-size: cover;だけで、ページは以前と同じように画像で構成されています。

その itemprop を に与えるのは理にかなってい<div>ますか?

4

3 に答える 3

11

これは、itemscope を含む div 内でメタ タグを使用するのに適しています。

そのメタ タグに必要な 2 つの属性はitempropcontent

<meta itemprop="image" content="/some/url/to/an/image.gif" />

http://www.google.com/webmasters/tools/richsnippetsでテストして、実際にメタ情報が問題なく読み取られることを確認できます。

于 2013-08-08T18:32:12.823 に答える
0

imgDOM で表示する必要があるが として視覚的に操作する必要がある場合は、コンテンツで を指定して CSS で非表示にしてみbackground-imageませんか? 私の目には少し伝統的なものにするだけでなく、画像の保存(右クリックのメニューツリー)やカーソルの強調表示など、ユーザーが期待するデフォルトのブラウザー機能を保持するだけでなく、metaタグを除外します.body

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

    <style scoped>
    /* I only use scoped to avoid excess classing in this demo.
       Read: http://caniuse.com/#feat=style-scoped */
      figure
      { position: relative;
        background-size: cover;
        background-position: center center }

      figure > img[itemprop=image]
      { opacity: 0;
        position: absolute;
        left: 0; top: 0;
        width: 100%; height: 100% }

      .specific-image
      { background-image: url(/path-to/image.jpg);
        width: 300px; height: 150px }
    </style>

    <figure class="specific-image">
        <img itemprop="image" src="/path-to/image.jpg" width="150" height="150" alt="image">
    </figure>

</div>

リソースは同じ URL パスであるため、一度だけダウンロードされ、追加の HTTP 要求はありません。

于 2016-03-08T16:38:27.107 に答える