html - 如何为多个og设置高度和宽度:image elements

Question

如果你设置多个 og:image 标题，例如:

  <meta property="og:image" content="img1.png" />
  <meta property="og:image" content="img2.png" />

如果图像尺寸不同，如何设置多个宽度和高度？

    <meta property="og:image:width" content="100">
    <meta property="og:image:height" content="100">

我可以只设置一组宽度和高度元素还是像这样设置多个？

  <meta property="og:image" content="img1.png" />
  <meta property="og:image:width" content="100">
  <meta property="og:image:height" content="100">

  <meta property="og:image" content="img2.png" />
  <meta property="og:image:width" content="200">
  <meta property="og:image:height" content="200">

Answer 1

可以设置多个。根据documentation您可以在声明根标记后放置结构化属性。每当解析另一个根元素时，该结构化属性就被认为已完成并开始另一个。

例如:

<meta property="og:image" content="https://example.com/rock.jpg" />
<meta property="og:image:width" content="300" />
<meta property="og:image:height" content="300" />
<meta property="og:image" content="https://example.com/rock2.jpg" />
<meta property="og:image" content="https://example.com/rock3.jpg" />
<meta property="og:image:height" content="1000" />

表示此页面上有 3 张图片，第一张图片为 300x300，中间一张未指定尺寸，最后一张为 1000px 高。