3

組み込みの画像検索が生成するような「グリッド上の 6 つの画像」形式のタイムライン カードを生成するための正しい HTML/JSON 構文は何ですか? サンプル添付。私のガラス製品が生成しているレスポンスバンドルのリードカードにしたいです。

ガラス上の画像結果

4

2 に答える 2

3

HTML で標準の CSS を使用して、画像を生成できます。そのような例の 1 つ (プレイグラウンドを使用して確認する) は次のとおりであり、機能しているように見えます。

{
  "html": "<style>\n.box {\n  width: 210px;\n  height: 180px;\n  float: left;\n  border: thin solid white;\n}\n</style>\n\n    <div class=\"box\">\n      <img class=\"box\" src=\"https://lh3.googleusercontent.com/-quy9Ox8dQJI/T3xUHhub6PI/AAAAAAAAHAQ/YvjqA3Pw1sM/glass_photos.jpg?sz=360\">\n    </div>\n    <div class=\"box\">\n      <img class=\"box\" src=\"https://lh3.googleusercontent.com/-quy9Ox8dQJI/T3xUHhub6PI/AAAAAAAAHAQ/YvjqA3Pw1sM/glass_photos.jpg?sz=360\">\n    </div>\n    <div class=\"box\">\n      <img class=\"box\" src=\"https://lh3.googleusercontent.com/-quy9Ox8dQJI/T3xUHhub6PI/AAAAAAAAHAQ/YvjqA3Pw1sM/glass_photos.jpg?sz=360\">\n    </div>\n    <div class=\"box\">\n      <img class=\"box\" src=\"https://lh3.googleusercontent.com/-quy9Ox8dQJI/T3xUHhub6PI/AAAAAAAAHAQ/YvjqA3Pw1sM/glass_photos.jpg?sz=360\">\n    </div>\n    <div class=\"box\">\n      <img class=\"box\" src=\"https://lh3.googleusercontent.com/-quy9Ox8dQJI/T3xUHhub6PI/AAAAAAAAHAQ/YvjqA3Pw1sM/glass_photos.jpg?sz=360\">\n    </div>\n    <div class=\"box\">\n      <img class=\"box\" src=\"https://lh3.googleusercontent.com/-quy9Ox8dQJI/T3xUHhub6PI/AAAAAAAAHAQ/YvjqA3Pw1sM/glass_photos.jpg?sz=360\">\n    </div>\n\n",
  "notification": {
    "level": "DEFAULT"
  }
}

これは、画像を含むフローティング div を使用して効果を実現します。同じ目的でテーブルを使用することもできます。

于 2013-06-02T14:44:23.147 に答える