layout-v1.html 1022 B

12345678910111213141516171819202122232425262728
  1. <h2>活动主页布局选择</h2>
  2. <p class="subtitle">通过「更多」按钮进入的专属活动聚合页</p>
  3. <div class="options">
  4. <div class="option" data-choice="a" onclick="toggleSelect(this)">
  5. <div class="letter">A</div>
  6. <div class="content">
  7. <h3>卡片瀑布流</h3>
  8. <p>上方筛选标签 + 下方卡片列表,支持下拉刷新/上拉加载更多。适合活动数量较多的场景。</p>
  9. </div>
  10. </div>
  11. <div class="option" data-choice="b" onclick="toggleSelect(this)">
  12. <div class="letter">B</div>
  13. <div class="content">
  14. <h3>Banner + 分类Tab</h3>
  15. <p>顶部Banner轮播 + 横向分类Tab + 单列活动卡片。适合突出重点活动。</p>
  16. </div>
  17. </div>
  18. <div class="option" data-choice="c" onclick="toggleSelect(this)">
  19. <div class="letter">C</div>
  20. <div class="content">
  21. <h3>网格+列表混合</h3>
  22. <p>置顶推荐活动用大卡片网格,列表用双列卡片。兼顾曝光与浏览效率。</p>
  23. </div>
  24. </div>
  25. </div>